我的磨文件列表实现隔行换色CSS代码

此代码仅供参考

---

代码说明

通过CSS3伪类nth-of-type(n)实现，效果还不错，除了背景色以外，还可以添加其他更多属性，自己发挥吧。

---

CSS代码(样式一)

.file_list li:nth-of-type(odd){ background:#ccc; /*奇数行背景色*/ } .file_list li:nth-of-type(even){ background:grey; /*偶数行背景色*/ } .file_list li:nth-of-type(odd) a{ color:#333; /*奇数行链接文字颜色*/ } .file_list li:nth-of-type(even) a{ color:#fff; /*偶数行链接文字颜色*/ }

---

代码演示

•  节日倒计时代码
•  高考倒计时代码
•  下载声明(html)
•  tzs小客站留言板
•  uyan-favicon(ico)
•  ujian-favicon(ico)

---

CSS代码(样式二)

.file_list li{font-family:"Microsoft yahei"; font-size:14px;} .file_list li{width:100%; height:32px; line-height:32px; padding-left:2px; text-align:left;} .file_list li:nth-of-type(odd){background:#ccc;}/*奇数行背景色*/ .file_list li:nth-of-type(even){background:grey;}/*偶数行背景色*/ .file_list li:nth-of-type(odd) a{ color:#930;}/*奇数行链接文字颜色*/ .file_list li:nth-of-type(even) a{ color:#fff;}/*偶数行链接文字颜色*/

---

代码演示

•  节日倒计时代码
•  高考倒计时代码
•  下载声明(html)
•  tzs小客站留言板
•  uyan-favicon(ico)
•  ujian-favicon(ico)

---

---