1.first-child 选择列表中的第一个标签 li:first-child{color:red} 2. last-child 选择列表中的最后一个标签 li:last-child{color:pink} 3.nth-child(n) 这里的n为数字,表示选择列表中的第n个标签 例如选择第三个标签 li:nth-child(3){color:pink} 4.nth-child(2n) 选择列表中的偶数,选中 2、4、6...
first-child 和last-child是伪类选择器,选择第一个和选择最后一个子元素 现在实现下面的效果 1. .menuico span { display: block; width: 21px; height: 2px; background-color: #666; } .menuico span:first-child { margin-top: -6px; } .menuico span:last-child { margin-top: 6px; } 1....
可以看出2个tab之间有一天分割线,这条分割线没有使用单独的div或者span。而是使用li标签的border-right。但是最后一个需要隐藏,否则效果不是很理想。 最原始的写法是: 1:#tabnav li:last-child 2:{ 3:border-right:none; 4:} 在常用的浏览器中测试都通过了。但是IE7/8中,此样式不起作用。D右侧的边框还是...
可以,不过用纯CSS的话在有的浏览器下下无法实现。可以用JS解决,对CSS熟悉的话推荐用jQuery,因为jQuery的选择器与CSS选择器简直一模一样,很容易就能上手
div{ width: 200px; height: 200px; ba
CSS :first-child选择器的使用示例 示例1:选择每个 中的每个 元素并设置其样式,其中的 元素是其父元素的第一个子元素: <!DOCTYPEhtml>p:first-childi{background:yellow;}I am astrongman. I am astrongman.I am astrongman. I am astrongman. AI代码助手复制代码 效果图: 示例2:每一个元素的第...
可以看出2个tab之间有一天分割线,这条分割线没有使用单独的div或者span。而是使用li标签的border-right。但是最后一个需要隐藏,否则效果不是很理想。 最原始的写法是: 代码语言:javascript 复制 1: #tabnav li:last-child 代码语言:javascript 复制 2: { 代码语言:javascript 复制 3: border-right:none; 代码语...
1:#tabnav li:last-child 2:{ 3:border-right:none; 4:} 在常用的浏览器中测试都通过了。但是IE7/8中,此样式不起作用。D右侧的边框还是会出现。我想了一下,那就给最后一个li加一个样式: D Content lastitem是我们为最后一个li标签添加的类。然后给lastitem添加border-right...
p:first-child{ background-color:yellow;} 注释:所有主流浏览器都支持 :first-child 选择器。对于 IE8 及更早版本的浏览器中的 :first-child,必须声明 <!DOCTYPE>。 CSS :first-child选择器的使用示例 示例1:选择每个 中的每个 元素并设置其样式,其中的 元素是其父元素的第一个子元素: <!DOCTYPE htm...