虽千万人而吾往矣...
+号选择器
该选择器是相邻兄弟选择器,什么是相邻兄弟选择器呢?
即----两个元素同级别,有同一个父元素,相当于jquery的next。
举例
- css代码
<style type="text/css">
h1 + p {margin-top:50px;}
</style>
- html代码
<body>
<h1>This is a heading.</h1>
<p>This is paragraph.</p>
<p>This is paragraph.</p>
<p>This is paragraph.</p>
<p>This is paragraph.</p>
<p>This is paragraph.</p>
</body>
-
运行效果
image.png - 解释
body下面的h1和五个p元素为兄弟元素,他们有同一个父元素body。
h1+p的话仅仅是选择的其后的第一个p元素,对于其他的p元素无效。
checked元素
选择所有被选中的元素。仅仅适用于input的多选按钮和单选按钮。
比较常用的方式如下:
input:checked
{
background-color: #ff0000;
}
此时,所有被选中的单选按钮和多选按钮都会改变背景色。
特别注意
该选择器仅仅适用于Opera,对于其他任何浏览器都不适用。
网友评论