BBCode [tip] ver 2.1, BBCode [tips] [tool], BBCode [tipin] [tipout]

[indent]BBCode tạo chú thích[/indent]
Giới thiệu về BBCode tip 2.0.
Phần trong spoiler là phần nâng cao, có thể bỏ qua nếu muốn.
Các tip cũ vẫn hoạt động như bình thường.

[hs1]BBCode tip[/hs1]
[box="border: 5px double black; float: left; margin-right: 5px; padding: 5px; background-color: #fff"]
[toc][/box][hs2]tip - Cơ bản[/hs2]
[indent]BBCode này sẽ bọc chú thích (sau này gọi là tip) trong (?), khi đưa chuột vào thì bảng chú thích sẽ hiện ra.
[cbox][ob]tip[cb]{Nội dung bên trong tip}[ob]/tip[cb][/cbox]

[tip]Đây là nội dung bên trong tip[/tip]

[ob]tip[cb]Đây là nội dung bên trong tip[ob]/tip[cb]

Ngang đây là bạn đã có thể sử dụng được code tip rồi. Nếu muốn có khả năng tùy biến nhiều hơn thì hãy đọc tiếp.
[hs2]tip - Các thuộc tính trung bình[/hs2]
Các thuộc tính tầm trung - style, class, link và tip
[indent][hs3]tip[/hs3]: Đặt nội dung chứa tip
Nếu không muốn dùng (?) mặc định, bạn có thể thay nó bằng đoạn văn bản khác tùy ý.

[tip tip="Chú thích"]Đây là nội dung bên trong tip[/tip]

[ob]tip tip="Chú thích"[cb]Đây là nội dung bên trong tip[ob]/tip[cb]

[hs3]style[/hs3]: Quyết định bề ngoài của tip
Thuộc tính này tiếp nhận thông số CSS.
Màu của mũi tên chỉ thay đổi theo màu viền.

[tip style="border: 4px double red"]Đây là nội dung bên trong tip[/tip]

[ob]tip style="border: 4px double red"[cb]Đây là nội dung bên trong tip[ob]/tip[cb]

[hs3]class[/hs3]: Đặt lớp cho tip
[hs3]link[/hs3]: Đặt url cho tip
Url này sẽ được mở khi người dùng bấm trực tiếp vào tip, mặc định là nhảy lên đầu trang hiện tại.

[tip link="http://www.gensokyovn.net/"]Đây là nội dung bên trong tip[/tip]

[ob]tip link="http://www.gensokyovn.net/"[cb]Đây là nội dung bên trong tip[ob]/tip[cb]

[/indent]

Ngang đây là bạn đã có thể tùy biến code tip thoải mái theo ý mình rồi . Phần tiếp theo nói về các thông số cao cấp của tip, có thể bỏ qua nếu muốn. [/indent]

[hs2]tip - Các thuộc tính cao cấp[/hs2]
[indent]Các thuộc tính cao cấp - click, type và key

Spoiler:

[hs1]BBCode tipin và tipout[/hs1]
[indent]Phối hợp tipin và tipout để tạo ra combo nhảy tới-lui giữa tip và dòng chú thích như của wiki.
Khóa sẽ kết nối giữa phần chú thích trên và dưới.
Hiện tại chưa có hệ thống đánh số tự động, vậy nên tên của khóa cũng chính là số thứ tự của tip.
[cbox][ob]tipout="key"[cb]

[ob]tipin="key"[cb]{Nội dung bên trong tip}[ob]/tipin[cb][/cbox]

[tipout="1"] [tipin="1"]Đây là nội dung bên trong tip[/tipin]

[ob]tipout="1"[cb] [ob]tipin="1"[cb]Đây là nội dung bên trong tip[ob]/tipin[cb]

[/indent]
Giờ bạn có thể thử bấm vào tip, bạn sẽ nhảy tới dòng chú thích và dòng đó sẽ được làm nổi, bấm vào số thứ tự để nhảy về tip ban đầu.


[hs1]tips và tool[/hs1]
Giới thiệu về BBCode tips và tool.
[hs2]tips[/hs2]
BBCode tips cho phép tạo ra một tip với nhiều bảng nội dung khác nhau. Không như BBCode tip chỉ có một bảng nội dung ứng với mỗi tip, ngoài ra trong khi tip tạo bằng BBCode tip chỉ chấp nhận nội dung văn bản, tip tạo bằng BBCode tips có thể dùng lên mọi loại nội dung.
Các BBCode tip nằm bên trong tips sẽ chỉ hiển thị nội dung của tip.
[cbox][ob]tips[cb]
[indent][ob]tool[cb]{Nội dung}[ob]/tool[cb]
[ob]tip[cb]{Nội dung tip 1}[ob]/tip[cb]
[ob]tip[cb]{Nội dung tip 2}[ob]/tip[cb]
[ob]tip[cb]{Nội dung tip n}[ob]/tip[cb]
[/indent]
[ob]/tips[cb][/cbox]

[tips][tool]Đây là tip[/tool] [tip type="center,left"]Đây là nội dung bên trong tip 1[/tip] [tip type="center,top"]Đây là nội dung bên trong tip 2[/tip] [tip type="center,right"]Đây là nội dung bên trong tip 3[/tip][/tips]

[ob]tips[cb] [indent][ob]tool[cb]Đây là tip[ob]/tool[cb] [ob]tip type="center,left"[cb]Đây là nội dung bên trong tip 1[ob]/tip[cb] [ob]tip type="center,top"[cb]Đây là nội dung bên trong tip 2[ob]/tip[cb] [ob]tip type="center,right"[cb]Đây là nội dung bên trong tip 3[ob]/tip[cb][/indent] [ob]/tips[cb]

Trong ví dụ mình đang đặt thuộc tính type của 3 bảng tip ra 3 loại khác nhau, vì nếu không chúng sẽ phủ chồng lên nhau.
[hs2]tool[/hs2]
BBCode tool giúp đặt lại nội dung của tip, nếu không tìm thấy BBCode tool, nội dung của tip sẽ là nội dung mặc định ((?)).

[tips][tool][/tool] [tip type="center,left"]Đây là nội dung bên trong tip 1[/tip] [tip type="center,top"]Đây là nội dung bên trong tip 2[/tip] [tip type="center,right"]Đây là nội dung bên trong tip 3[/tip][/tips]

[ob]tips[cb] [indent][ob]tool[cb][ob]img(125px,125px)[cb]https://2img.net/u/1513/31/05/82/avatars/1395-85.jpg[ob]/img[cb][ob]/tool[cb] [ob]tip type="center,left"[cb]Đây là nội dung bên trong tip 1[ob]/tip[cb] [ob]tip type="center,top"[cb]Đây là nội dung bên trong tip 2[ob]/tip[cb] [ob]tip type="center,right"[cb]Đây là nội dung bên trong tip 3[ob]/tip[cb][/indent] [ob]/tips[cb]

[hs2]tips - Các thuộc tính[/hs2]
[indent][hs3]click[/hs3]
Đã giới thiệu ở trên.
[hs3]link[/hs3]
Đã giới thiệu ở trên.
[hs3]key[/hs3]
Đã giới thiệu ở trên.[/indent]

[hs1]Changelog[/hs1]
- Ver 2.0 lên 2.1:
* Các thuộc tính class-outer, style-outer bị loại bỏ.
* Click được tách ra làm thuộc tính đơn.
* Tip giờ cho phép hỗ trợ class có thuộc tính transition.
* BBCode [tipbox] bị loại bỏ.
* Thêm các BBCode [ob]tips[cb] và [ob]tool[cb]

[hs1]FAQ[/hs1]
[indent]
Q: Mình vô ý khiến mấy hộp nội dung che mất tiêu mấy cái nút tip rồi, giờ không tắt đi được.
A: Bấm vào mũi tên chỉ của một trông số mấy cái tip đó. Toàn bộ tip trong chuỗi sẽ tự tắt.
Q: Mình để no-arrow thì sao...
Q: Mình lỡ che mất tiêu mấy cái mũi tên luôn...
Q: Mình...
A: Bấm F5 để nhận sự trợ giúp nếu đang soạn thảo thì nhớ lưu lại bài trước.
Q: Mình có thể tạo được nhiều tip lồng nhau không?
A: Được. [tips]
[tool]Đây là tip[/tool]
[tip]Tip 1 Tip 1 Tip 1 Tip 1 [tips]
[tool]Đây là tip nằm trong tip[/tool]
[tip type="center,right"]Tip 2 Tip 2 Tip 2 Tip 2
Tip 2 Tip 2 Tip 2 Tip 2
Tip 2 Tip 2 Tip 2 Tip 2[/tip]
[tip type="center,bot"]Tip 2 Tip 2 Tip 2
Tip 2 Tip 2 Tip 2
Tip 2 Tip 2 Tip 2[/tip]
[/tips][/tip]
[tip type="center,left"]Tip 1 Tip 1 Tip 1
Tip 1 Tip 1 Tip 1
Tip 1 Tip 1 Tip 1[/tip]
[/tips]

Q: Mình có thể tạo thêm tip trong BBCode tool không?.
A: Về lý thuyết thì được, nhưng không khuyến khích. [tips]
[tool]Đây là tip nằm trong tool
[tips]
[tool]Tip trong tool[/tool]
[tip type="center,right"]Tip 2 Tip 2 Tip 2 Tip 2
Tip 2 Tip 2 Tip 2 Tip 2
Tip 2 Tip 2 Tip 2 Tip 2[/tip]
[tip type="center,bot"]Tip 2 Tip 2 Tip 2
Tip 2 Tip 2 Tip 2
Tip 2 Tip 2 Tip 2[/tip]
[/tips][/tool]
[tip]Tip 1 Tip 1 Tip 1 Tip 1
Tip 1 Tip 1 Tip 1 Tip 1
Tip 1 Tip 1 Tip 1 Tip 1[/tip]
[tip type="center,left"]Tip 1 Tip 1 Tip 1
Tip 1 Tip 1 Tip 1
Tip 1 Tip 1 Tip 1[/tip]
[/tips]

Q: Khi mình thu nhỏ cửa sổ lại thì tip nó bị lệch lệch sao ấy.
A: Dùng thông số style-outer đặt width cố định.[/indent]

[metabox][tablestyle="alter"]border: 1px solid #00bb00; border-radius: 5px; width: 100%[/tablestyle]
[tablestyle="alter td"]border: 1px solid #00bb00; border-radius: 5px; padding: 2px[/tablestyle]
[style="buton2"]width: 100%; border: 2px solid #0e0; padding: 2px; margin-left: 1px[/style]
[style="butoff2"]width: 100%; border: 2px solid #0e0; background-color: #0e0; padding: 2px; margin-left: 1px[/style]
[style="tab2"]width: 100%;
margin: 0px;
border-width: 2px;
border-color: #0e0;
border-style: none solid solid solid;[/style]
[export="1"]Nội dung bên trong tip
Nội dung bên trong tip
Nội dung bên trong tip[/export]
[style="xz"]background-color: #FFF;
 border: 1px solid #C9D2D8;
 font-size: 1em;
 padding: 3px;display: block;
[/style]
[style="abc"]background-color: #ded;
 font-family: monospace;[/style][/metabox]