当前位置: 首页 > Web前端 > CSS

CSS3选择器

时间:2023-03-30 18:08:25 CSS

CSS3选择器你知道各种各样的选择器吗?下面为您一一列举。1、标签选择器标签选择器也叫元素选择器,换句话说,文档的元素是最基本的选择器,直接用元素名直接选择元素即可。比如你可以直接选择下面的p标签

2.类选择器类选择以点“.”开头,后跟类名。类名不允许有空格,必须和元素中class属性的值保持一致。一个元素可以有多个类值,每个值由一个空格分隔。具有相同类名的元素属于一类元素。比如下面class中的class
    创建一个HTML文档创建一个CSS样式表将它们链接在一起
3.ID选择器ID选择器以“#”开头,后跟ID名称。在一个文档中,ID值不能重复,所以这个选择器在选择文档中唯一的元素时比较有用。比如下面的id选择—“早上好。”

—“走开!”

4.通用选择器用“*”表示通用选择器,表示选择所有元素,通常用在组合选择器中。比如left-nav的所有子元素都选择如下
推荐
发现音乐
我的音乐
下载的音乐
5.层次选择器5.1后代选择器使用“”开启两个选择器。例如“ulli”表示选择ul的后代元素li,li可以是ul的直接子元素,也可以是ul的孙元素。5.2后代选择器用“>”分隔两个选择器。例如“ul>li”表示选择ul的直系后代元素li,不能选择ul的孙元素li5.3相邻兄弟选择器用“+”分隔两个选择器。例如,“.one+*”表示选择“one”元素的下一个兄弟元素。5.4通用兄弟选择器用“~”分隔两个选择器。例如“.one~*”表示选择class为“one”的所有兄弟元素。6.属性选择器属性选择器有以下几种,就是选择button中name属性的元素,name值为delbutton[name=del]{border:2pxdotted#ccc;}添加删除Update
7.伪类选择器伪类以“:”开头,使用选择器后,它用于表示该元素只能在特殊状态下被选中7.1表示子元素7.2与状态相关的伪元素selector伪元素以“::”开头,用于选择器之后选择指定的元素