标准布局应用：选项卡[兼容IE6\IE7\FireFox\Opera]
HTML代码[Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]
程序代码/* 选项卡关键属性 */
#tab { width:570px; height:260px; position:relative; } /*设置容器高宽等*/
html > body #tab { width:566px; }/*兼容IE6:IE6下宽度不够*/
#tab div { position:absolute; top:26px; left:0; width:564px; height:234px; border:solid #eee; border-width:0 1px 1px; }/*设置被操作容器高宽等*/
#tab div { display:none; }/*设置被操作容器默认隐藏:不用ID是因为下面将利用class来控制被操作容器显示,而class优先级低于id选择器*/
#tab .block { display:block; }/*选中的被操作容器*/
#tab h3 { float:left; width:114px; height:26px; line-height:26px; margin:0 -1px 0 0; font-size:14px; cursor:pointer; font-weight:normal; text-align:center; color:#00007F; background:#eee url(attachments/month_0612/720061212105226.gif) no-repeat; }/*默认标题样式*/
#tab .up { background:#fff url(attachments/month_0612/x20061212105231.gif) no-repeat; }/*选中的标题样式*/
/*修饰列表内容*/
#tab ul { margin:15px 0 0; list-style:none; padding:0; }
#tab li { float:left; width:50%; background:url(attachments/month_0612/a20061212105235.gif) no-repeat 25px 10px; }
#tab li a { display:block; width:84%; height:25px; line-height:25px; margin-left:8%; font-size:12px; text-decoration:none; color:#333; background:url(attachments/month_0612/g20061212105238.gif) repeat-x left bottom; text-indent:10px; }
#tab li a:hover { text-decoration:underline; color:#f00; }
浙公网安备 33010602011771号