初学div+css之选项卡篇

in 未分类

经历简单的横向、纵向、二级菜单后,开始“滑动门”之旅。

(在阿捷的网站上借用了一幅图片)

想法是用无序列表ul来实现


运行代码

每一个li设定好border属性,除了底部的之外,因为底部那根线条要ul的border-bottom去处理。

因为横向显示,所以li要进行float:left;

再则,li进行float:left之后,ul无法确定其自身的高度,所以需要显示指定一个高:

#nav
{
padding:10px 0 0 46px;
margin:0px;
width:80%;
list-style:none;
height:26px; /*这里一定要指定*/
border-bottom:solid 1px #690; /*设定底部线条*/
}

由于IE与FireFox的差异性,需同时指定li与li a的width/height的值。
没想到这样一小小的东东,却这样大伤脑筋 T_T

2 Comments

2 Comments

  1. 你到底在学啥?
    JS?
    PHP??
    DIV+CSS???

  2. 我在学习前台技术
    主要在web标准

Leave a Reply

Using Gravatars in the comments - get your own and be recognized!

XHTML: These are some of the tags you can use: <a href=""> <b> <blockquote> <code> <em> <i> <strike> <strong>