Tả pí lù BBCode

[Ultimate]

Mọi người cần gì/muốn hỏi gì vô đây nha.
Các code đơn giản có thể mình sẽ làm được luôn, những thứ phức tạp chắc phải để sau.

Edit: Tiêu chí thêm BBCode:
1. Tiện lợi cho đa số người dùng
2. Thay thế cho 1 hay nhiều đoạn html/css/js/php dài dòng, phức tạp

Một số thứ đang xếp hàng chờ được làm: <style>, importfont.

 

[Mực]

BBCode flex box. Dùng bọc code tip lại để dàn thành hàng ngang.

HTML:

<div style="display: flex;flex-wrap:wrap;">{TEXT}</div>

BBCODE:

[flex]{TEXT}[/flex]

Cách sử dụng: Dùng bọc code tip lại để dàn thành hàng ngang. Có thể xuống hàng thoải mái trong code flex mà không ảnh hưởng giao diện bên ngoài -> dễ phân chia tip hơn.

[flex]
[box=;display: inline-block;width:122px;margin:5px;text-align:center||||][box=; border: 1px #3f3f3f solid;||||][szimg=120|]https://i.imgur.com/pv9dgC9.jpg[/szimg][/box]???[/box]

[box=;display: inline-block;width:122px;margin:5px;text-align:center||||][box=; border: 1px #3f3f3f solid;||||][szimg=120|]https://i.imgur.com/pv9dgC9.jpg[/szimg][/box]???[/box]
[/flex]

Sẽ tương đương với kết quả thế này:

???

???

 

[Ultimate]

BBCode flex box. Dùng bọc code tip lại để dàn thành hàng ngang.

HTML:

<div style="display: flex;flex-wrap:wrap;">{TEXT}</div>

BBCODE:

[flex]{TEXT}[/flex]

Cách sử dụng: Dùng bọc code tip lại để dàn thành hàng ngang. Có thể xuống hàng thoải mái trong code flex mà không ảnh hưởng giao diện bên ngoài -> dễ phân chia tip hơn.

[flex]
[box=;display: inline-block;width:122px;margin:5px;text-align:center||||][box=; border: 1px #3f3f3f solid;||||][szimg=120|]https://i.imgur.com/pv9dgC9.jpg[/szimg][/box]???[/box]

[box=;display: inline-block;width:122px;margin:5px;text-align:center||||][box=; border: 1px #3f3f3f solid;||||][szimg=120|]https://i.imgur.com/pv9dgC9.jpg[/szimg][/box]???[/box]
[/flex]

Sẽ tương đương với kết quả thế này:

???

???

Flex rất tiện lợi, đáp ứng tiêu chí 1 ở #1 tuy nhiên mình sẽ không thêm BBCode này, lý do như sau:
1. flex có rất nhiều options và tất cả đều có thể bỏ trong div (a.k.a [box])
2. nếu để sẵn flex-wrap:wrap; vô, những ai cần dùng nowrap hay wrap-reverse sẽ phải định nghĩa lại bằng cách dùng !important
3. nếu chỉ thay mỗi

[box=;display:flex;][box]

thành

[flex][/flex]

thì cũng không tiết kiệm là mấy diện tích editor