CSS3 选择器

2i18ns 发布于2019-08-30 14:20 / 2080人阅读

摘要：选择器各种选择器你都知道吗下面一一为你罗列一下。例如如下标签即可直接选择类选择器类选择以点开头，后面紧跟一个类名。一般同胞选择器使用隔开两个选择器。例如表示选择为元素的所有兄弟元素。

CSS3 选择器

各种选择器你都知道吗？下面一一为你罗列一下。

1.标签选择器

标签选择器又叫元素选择器，换句话说，文档的元素就是最基本的选择器，使用元素名称直接选中元素即可。

例如如下p标签即可直接选择

one

two

three

2.类选择器

类选择以点"."开头，后面紧跟一个类名。类名不允许有空格，与元素中class属性的值保持一致。一个元素可以有多个class的值，每个值通过空格分割开。类名相同的元素属于一类元素。

例如如下class里面的类


            
        Create an HTML document
        Create a CSS style sheet
        Link them all together

3.ID选择器

ID选择器以"#"开头，后面紧跟一个ID名，在一个文档中，ID值不能重复，因此在选择文档中唯一元素的时候该选择器比较有用。

例如如下id选择

— "Good morning."

— "Go away!"

4. 普遍选择器

使用“*”来表示普遍选择器，表示选择所有元素，通常用在组合选择器中。

例如如下选择的就是left-nav的所有子元素


    
    
                         
            推荐                
            <
            i class="icon-music">发现音乐        
                        
                        
            我的音乐    
                
                下载的音乐

5.层次选择器

5.1后代选择器

使用 “ ” 隔开两个选择器。例如 “ul li”表示选择ul的后代元素li，li可以为ul的直接子元素，也可以为ul的孙子元素。

5.2子代选择器

使用 “>” 隔开两个选择器。例如 "ul>li"表示选择ul的直接子代元素li,ul的孙子元素li无法被选择到

5.3相邻同胞选择器

使用 “+” 隔开两个选择器。例如 ".one+*"表示选择class为"one"元素的下一个兄弟元素。

5.4一般同胞选择器

使用 “~” 隔开两个选择器。例如 ".one~*"表示选择class为"one"元素的所有兄弟元素。

6.属性选择器

属性选择器有以下几种

例如如下，就是选择button中具有name属性的元素并且name的值为del的元素

7.伪类选择器

伪类以":"开头，用在选择器后，用于指明元素在某种特殊的状态下才能被选中

7.1表示子元素

7.2 与状态相关

伪元素选择器

伪元素以"::"开头，用在选择器后，用于选择指定的元素

GPU云服务器云服务器选择器派生选择器省市选择器属性选择器

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/115955.html

CSS3中的选择器

通配符选择器类选择器 id选择器元素选择器属性选择器后代选择器子元素选择器兄弟选择器伪元素选择器伪类选择器群组选择器这里总结一共有11种选择器，分别为：通配符选择器、类选择器、id选择器、元素选择器（又叫标签选择器）、属性选择器、伪类选择器、伪元素选择器、后代选择器（又叫包含选择器）、子元素选择器、兄弟选择器（相邻兄弟选择器+、通用兄弟选择器~）、群组选择器（几个共用一...

番茄西红柿 2019-04-23 13:45 评论0 收藏0
小程序/uniapp支持的css选择器一览

摘要：本次测试主要参考文档为选择器参考手册主要是安卓微信小程序的选择器兼容入坑小程序过程中看到微信对支持的选择器的描述只有六个分别是但是看到给写的花里胡哨的的库还有各种花里胡哨的小程序并且还表明支持之前各种无的库所以我觉得事情并没有这么简单趁着元本次测试主要参考文档为w3school CSS 选择器参考手册 (主要是安卓/ios/微信小程序的css选择器兼容) 入坑uniapp/小程序过...

MockingBird 2019-08-30 15:55 评论0 收藏0
CSS3 选择器

摘要：选择器各种选择器你都知道吗下面一一为你罗列一下。例如如下标签即可直接选择类选择器类选择以点开头，后面紧跟一个类名。一般同胞选择器使用隔开两个选择器。例如表示选择为元素的所有兄弟元素。 CSS3 选择器各种选择器你都知道吗？下面一一为你罗列一下。 1.标签选择器标签选择器又叫元素选择器，换句话说，文档的元素就是最基本的选择器，使用元素名称直接选中元素即可。例如如下p标签即可直接...

singerye 2019-08-22 16:00 评论0 收藏0
CSS3 选择器

摘要：选择器各种选择器你都知道吗下面一一为你罗列一下。例如如下标签即可直接选择类选择器类选择以点开头，后面紧跟一个类名。一般同胞选择器使用隔开两个选择器。例如表示选择为元素的所有兄弟元素。 CSS3 选择器各种选择器你都知道吗？下面一一为你罗列一下。 1.标签选择器标签选择器又叫元素选择器，换句话说，文档的元素就是最基本的选择器，使用元素名称直接选中元素即可。例如如下p标签即可直接...

shery 2019-08-02 10:06 评论0 收藏0