css中选择器很多
例句几个容易混淆的css选择器组合:
(1) element,element 意思是两个element 共享一个样式。
(2) elementA elementB 意思是A元素的所有子元素B都使用这个样式
(3) elementA>elementB 意思是A元素的子元素B使用该样式
其中(2)与(3)的区别就在于(2)是选择所有后代元素,而(3)只选择一代,并且是直接子关系,孙子关系都不可以。
实例:
![](https://img.haomeiwen.com/i6095934/d7a671752b2932c1.png)
CSS of (2) .test span { color: red}
![](https://img.haomeiwen.com/i6095934/9c8e2f27ff20bd39.png)
CSS of (3) .test>span { color: red}
![](https://img.haomeiwen.com/i6095934/c836a615342b9a69.png)
(4) elementA+elementB 表示紧跟着A 后面的B应该使用该样式, 且A和B应该是兄弟关系,并且拥有相同的父亲。
![](https://img.haomeiwen.com/i6095934/6313f27cd306de2c.png)
CSS of (4): .hello+.word { color:red; }
![](https://img.haomeiwen.com/i6095934/7abf05b655525e5f.png)
网友评论