Xem demo trực tiếp ở đây: http://fandung.110mb.com/CSS-tab/tab_menu.html
☼ Đầu tiên chèn đọan code CSS này vào template của blog.
1. Đăng nhập blog
2. Vào bố cục(Layout)
3. Vào chỉnh sửa code HTML (Edit code HTML)
4. Chèn đọan code CSS bên dưới vào trên dòng ]]></b:skin>
html{
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
}
#bar a{
padding:4px 6px;
background:#E0E9FE;
text-decoration:none;
font-weight:bold;
}
#bar a:hover{
color:#003366;
}
#container{
background:#E0E9FE;
padding:10px;
}
div.maintab div {
display: none
}
div.maintab div:target {
display: block
}
5. Save template.
6. Tạo Widget HTML/Javascript và chèn code HTML bên dưới vào:
<div id="bar">
<a href="#tab1">Tab 1</a>
<a href="#tab2">Tab 2</a>
<a href="#tab3">Tab 3</a>
<a href="#tab4">Tab 4</a>
</div>
<div id="container">
<div class="maintab">
<div id="tab1">
Tab 1 Content
</div>
<div id="tab2">
Tab 2 Content
</div>
<div id="tab3">
Tab 3 Content
</div>
<div id="tab4">
Tab 4 Content
</div>
</div>
</div>
7. Save lại là xong.
Chúc các bạn thành công.
Kỳ này viết nhiều bài theo ko kịp luôn :D , cứ tiếp tục phát huy nhé , Mình ủng hộ hết mình đấy , toàn bài chưa đọc bao giờ !!!
Để khi nào thay temp có nhiều không gian hơn sẽ xài hết mớ Thủ thuật của Fan Dũng :)
cảm ơn bạn nhiều. Được người khác comment ủng hộ bài viết của mình quả thật là rất vui, nó tạo động lực lớn cho mình. :D
Tuy nhiên hình như blog của mình vẫn chưa được nhiều người biết tới. Mình vẫn luôn lấy blog của bạn làm mục tiêu, có lẽ sẽ không bao giờ bằng nhưng "gần gần" cũng vui rồi. :D
Một lần nữa cảm ơn Kim Ngân đã ủng hộ nhiệt tình.
rất hay, thank's
diencg
五島列島
水産加工
牡蠣
きびなご
nhìn mtwj anh dũng như mặt lồn mà chỗ nào cũng mang ra khoe chán nhỉ
anh giải thích rõ ràng hơn dươc k?em không hiểu
Minh Coppy ve lam giong nhu vay nhung ben Trinh duyet Eplorer khong chạy duoc. ben Firefox thi chay duoc. ban co the chi cho cach chay ben trinh duyet Eplorer duoc khong. cam on ban nhieu.
» Nội dung phải liên quan tới chủ đề bài viết.
» Có thể sử dụng thẻ trích dẫn [quote], cấu trúc thẻ như bên dưới :
[quote=AUTHOR name=fdquote]NỘI DUNG[/quote]
» Có thể sử dụng các thẻ <b>,<i>,<a>.
BlOg FD chính thức đóng comment của khách ẩn danh.
BlOg FD.