CSS3的nth-child() 选择器，表格奇偶行变色

【CSS3的nth-child() 选择器，表格奇偶行变色】的更多相关文章

CSS3的nth-child() 选择器，表格奇偶行变色

nth-child() 应用背景 CSS3的nth-child() 选择器,我之前很少用,在做表格偶数行变色的时候,我通常在绑定的时候,做一个js判断,来加一个css,从而使表格偶数行和奇数行颜色不一样.这样的兼容性很好.但是最近在做手机网站的时候,由于手机网站对浏览器兼容要求相对较低,手机浏览器大部分都支持css3,这就大大提高了开发效率.可以随意使用CSS3 :nth-child()伪类选择器. nth-child()浏览器支持 IE9及以上版本,火狐,谷歌,Safari ,Opera都支持…

纯CSS3代码实现表格奇偶行异色，鼠标悬浮变色

1.首先会用到<tr></tr>元素两个伪类,nth-child()和hover. 然后需要注意的是伪类都是通过冒号引用的,不是点号,即tr:hover{} 其次,CSS代码中要注意顺序. tr:nth-child(odd){ background-color:#CFF;} tr:nth-child(even){ background-color:#699;} tr:hover{ background-color:#F0C;} 写成这样是可以正常完成所需要的功能的,但是如果你写成…

用jquery控制表格奇偶行及活动行颜色

虽然jquery流行已经很多年了,一直都感觉很难,也没有花时间去学习它,只是偶尔哪天心血来潮了去看一点点,时隔多日又会忘得一干二净.最近用到表格奇偶行不同色,不得不去再看jquery,虽然感觉还是难,但已经不像以前一样无从下手了.做完后不得不来感叹一下jquery真是太牛了,不用自己再写一大堆javascript函数去实现了,简单几句轻松搞定. 先定义好表格的奇偶行样式,如下代码: body { font-size:12px; } th { color: #FFFFFF; background:…