html中li标签的css样式问题

li标签的css样式名称是current

其中要说明的就是楼上说的有点小问题，li是dw的默认标签所以不需要调用class,直接设置完css之后li即可生效。不过它控制的是所有的li.如果要控制单个要分开定义css样式，然后再用class或id调用.

<style>

ul,li{padding:0margin:0}

ul{width:240pxheight:35px}

li{display:blockfloat:leftwidth:60pxheight:100%border-bottom:1px #000 solid text-align:center}

.act,li:hover{background:url(icon.png) no-repeat bottomborder-bottom:1px #00923f solid}

</style>

<ul>

<li class="act">aaaa</li>

<li>bbbb</li>

<li>cccc</li>

<li>dddd</li>

</ul>

其实没有那么复杂。

原理：

设置LI的底边框为黑色，然后把这几个LI都左浮动，这样它们就贴在一起了，连成一条底线，

然后LI:HOVER的时候，给LI加上背景图片和改变LI的底框颜色跟你图片的一样就可以了。。

也可以通过LI里加一个A，DISPLAY:BLOCK后，给它MARGIN-BOTTOM:-1PX来盖住原来线，也可以给它们做定位，，这些都行得通。。

但是个人觉得还是我上面写的那些比较简单实现。

CSS3可以直接选择奇偶数，，

<style>

#list li:nth-of-type(odd){ background:#00ccff}奇数行 

#list li:nth-of-type(even){ background:#ffcc00}偶数行 

</style>

<ul id="list">

<li>1</li>

<li>2</li>

<li>3</li>

<li>4</li>

<li>5</li>

<li>6</li>

</ul>

如果不想用CSS3，怕有些低版本不支持的话，你只能用JS或者JQ来做，

同理，JQ取行数的奇偶，给加上不同的样式就可以了。

---