Tạo tab nội dung cho blogspot

872 views

Published on

0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
872
On SlideShare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
3
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Tạo tab nội dung cho blogspot

  1. 1. Tạo tab nội dung cho blogspot1. Đầu tiên đăng nhập vào blog của bạn2. Vào bố cục(thiết kế) và chọn chỉ nh sử HTML3. Thêm code sau vào bên dưới thẻ <head><script language=javascript src=http://traidatmui-tips.googlecode.com/files/dom_tab.jstype=text/javascript/>4. Tiếp đến bạn thêm code bên dưới vào trước thẻ ]]></b:skin>div.domtab {padding:0;width:500px; /*độ rộng của tab*/font-size:90%; /*cỡ chữ của tab*/}ul.domtabs{float:left;width:100%;margin:0;list-style:none;padding-left: 0;}ul.domtabs li{float:left;padding:0px 1px 0px 0px;text-align: center;}ul.domtabs a{padding:5px;display:block;background:#999; /*màu nền của thư mục trong tab*/color: #fff; /*màu text của thư mục trong tab*/height:1em;font-weight:bold;text-decoration:none;}ul.domtabs a:hover{color: #0000ff; /*màu text của thư mục trong tab khi rê chuột*/background:#ccc; /*màu nền của thư mục trong tab khi rê chuột*/}div.domtab div {clear:both;width:auto;padding:0 2px;
  2. 2. margin: 0 0 1em 0;}div.domtab div {display: block; clear: both;}Bạn dựa vào các dòng chữ hướng dẫn (dòng màu xanh) và chỉnh sửa lại cho phù hợp.5. Đến đây bạn save template lại và trở về phần tử trang, thêm 1 HTML/Javascriptvà thêm vào code bên dưới<div class=domtab><ul class=domtabs><li><a href=#noidung1>Nội dung 1</a></li><li><a href=#noidung2>Nội dung 2</a></li><li><a href=#noidung3>Nội dung3</a></li></ul><div style=padding:3px; border: 2px solid #ccc;><a id=noidung1 name=noidung1></a><div class=tab_content_1>Nội dung 1</div></div><div style=padding:3px;display:none;border: 2px solid #ccc;><a id=noidung2 name=noidung2></a><div class=tab_content_2>Nội dung 2</div></div><div style=padding:3px;display:none;border: 2px solid #ccc;><a id=noidung3 name=noidung3></a><div class=tab_content_3>Nội dung 3</div></div></div>Chỉnh sửa code:- Bạn hãy chú ý các dòng text màu đỏ trong code, chúng phải là giống nhau tươngứng ở từng nội dung.- Bạn thay các text màu xanh lá đậm trong code thành tên thư mục mà bạn muốn tạo.- Và những dòng màu xanh dương đậm chính là phần chứa nội dung tương ứng vớitừng thư mục.Ở đây mình chỉ tạo tab có 3 nội dung cơ bản, bạn có thể tạo thêm nhiều nội dung kháctheo ý của mình Nguồn : http://htentertainment.blogspot.com/2011/10/tao-tab-noi-dung-cho- blogspot.htmlPosted in: Thủ thuật blog

×