常见css选择器有哪些

html-css08

常见css选择器有哪些,第1张

1.元素选择器：作用：通过元素选择器可以选择页面中的所有指定元素语法: 标签名{}2.id选择器：-通过元素的id属性值选择唯一元素-语法：#id属性值{} 3. 类选择器：- class属性和id属性类似，只不过class属性可以重复-拥有相同class属性值的元素，我们说他们是一组元素-一个元素可以有多个class属性值，多个值之间用空格隔开。 ！！！！！-通过元素的class属性值选中一组元素-语法：.class属性值{}4.选择器分组： -通过选择器分组可以同时选中多个选择器对应的元素。 -语法：选择器1，选择器2，选择器N{} -效果：同时选中了选择器1，2，N他们所指向的元素，实现了代码的复用。 5.通配选择器：-他可以用来选中页面中的所有元素。(模糊选择)-语法： *{}6.精准(复合)(交集)选择器： ！！！！！！-作用：- 可以选中同时满足多个选择器的元素 (精准选择)-语法：选择器1选择器2选择器N{} 指定同时选择器1，2，N的元素7.后代选择器：-作用：-可以选择某一元素的所有子孙元素。-语法：祖先元素 后代元素{}注：祖先元素与后代元素之间有一个空格。8.子元素选择器：-作用：-选中指定父元素的指定子元素。 注：明确子元素与子孙元素的区别-语法：父元素 >子元素 注：可在一个表达式中连续使用多个 >明确查找关系9.属性选择器：- 作用：可以根据元素中的属性或属性值来选取指定元素- 语法：[属性名] 选取含有指定属性的元素10.兄弟选择器：-选中某一个标签后的紧邻着的兄弟节点，若不紧邻则没用，选择不中。 -标签1 + 标签2{}-选中某一个标签的后面的所有兄弟节点-语法：前一个标签 ~ 后面的所有标签11.否定伪类：-作用：可以从已经选中的元素中剔除某些元素-语法：:not(选择器)-例如：p:not(.hello) 选中class属性不为hello的p标签

CSS选择器、优先级与匹配原理\x0d\x0a1.id 选择器（#myid）2.类选择器（.myclassname）3.标签选择器（div,h1,p）4.相邻选择器（h1+p）5.子选择器（ul 通配选择符的权值 0,0,0,0\x0d\x0a2.标签的权值为 0,0,0,1\x0d\x0a3.类的权值为 0,0,1,0\x0d\x0a4.属性选择的权值为 0,0,1,0\x0d\x0a5.伪类选择的权值为 0,0,1,0\x0d\x0a6.伪对象选择的权值为 0,0,0,1\x0d\x0a7.ID的权值为 0,1,0,0\x0d\x0a8.important的权值为最高 1,0,0,0\x0d\x0a使用规则： 选择器的权值加到一起，大的优先；如果权值相同，后定义的优先 。\x0d\x0a从上面我们可以得出两个关键的因素：\x0d\x0a1.权值的大小跟选择器的类型和数量有关\x0d\x0a2.样式的优先级跟样式的定义顺序有关

1、标签选择器（如：body,div）

2、类选择器（如：class="name"）

3、ID选择器（如：id="name"）

4、全局选择器（如：*号）

5、组合选择器（如：.head .head_logo,注意两选择器用空格键分开）

6、继承选择器（如：div p,注意两选择器用空格键分开）

7、伪类选择器（如：link、hover。）