首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > Web前端 >

一个比较漂亮的tab式样

2012-10-29 
一个比较漂亮的tab样式直接上代码吧:htmlheadmeta http-equivContent-Type contenttext/html c

一个比较漂亮的tab样式

直接上代码吧:

<html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><style>body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, form, p, blockquote, th, td {margin:0;padding:0;font:宋体;font-size:12px;}ol, ul {list-style:none outside none;}/*link*/a{color:#106aa9; text-decoration:none;}/*content nav one*/.navC{border-bottom:1px solid #cce2ed;}.navC li{border-left:1px solid #cce2ed;border-right:1px solid #cce2ed;}.navC li a{border-top:1px solid #cce2ed;background:#f1f6fa;font-size:14px;}.navC li a:hover{background:#ffffff;text-decoration:none;}.navC .current,.navC li:hover{border-left:1px solid #cce2ed;border-right:1px solid #cce2ed;}.navC li:hover a{border-top:1px solid #cce2ed;}.navC .current a,.navC .current a:hover{background:#ffffff;border-bottom:1px solid #ffffff;color:#333333;border-top:1px solid #cce2ed;}.navC .current a{ font-weight:700;}.navC{height:28px;line-height:28px;}.navC ul{padding-left:10px;float:left;margin-bottom:-1px;} /*ie6*/.navC li{float:left;margin-right:5px;}.navC li a{float:left;display:block;padding:0 15px;height:28px;overflow:hidden;margin-top:-1px;_position:relative;}.mb10{ margin:10px; }.mb20{ margin:20px; }.pd10{ padding:10px;}/*table*/.tdtable{border:0px;cellspacing:0;cellpadding:0;align:center;width:98%;border-collapse:collapse;}.tdtable th,tr{height:40px;}.tdtable th{background:#cce2ed;padding:10px;padding:4px;border:solid 1px #fff;}.tdtable td{border:solid 1px #cce2ed;padding:4px;}</style></head><body><div id="mainContainer"><div id="navContainer" hidefocus="true">系统设置1</a></li><li><a href="#" hidefocus="true">系统设置2</a></li><li hidefocus="true">系统设置3</a></li><li><a href="#" hidefocus="true">系统设置4</a></li><li><a href="#" hidefocus="true">系统设置5</a></li></ul></div><div align="right" colspan="6"><div id="footer">第1页, 共1页<a href="javascript:jumpPage(1)">首页</a><a href="javascript:jumpPage(1)">末页</a></div></td></tr></tbody></table></div></div></body></html>

?

看看效果吧:

一个比较漂亮的tab式样

?

热点排行