css的基本选择器,复合选择器,后代选择器
基本CSS选择器有标记选择器、类别选择器、ID选择器3种
1。标记选择器
每⼀种HTML标记的名称都可以作为相应的标记选择器的名称,如h1,p,等等
2。类别选择器
类别选择器的名称可以由⽤户⾃定义
格式如下:.class{color:green;font-size:20px;}
3。ID选择器
与类别选择器相试
格式如下:#id{color:green;font-size:20px;}
复合选择器:就是两个或者多个基本选择器,通过不同⽅式连接⽽成的选择器
有两种情况:”交集“选择器、“并集”选择器
1“交集”选择器:
由两个选择器直接连接构成,其结果是选中⼆者各⾃元素范围的交集,其中第⼀必须是标记选择器,第⼆个必须是类别选择器或者ID选择器,两个选择器之间不能有空格,必须连续书写
如:h3.class{color:red;font-size:23px;}
2“并集”选择器:
2.1同时选中各个基本选择器所选择的范围,任何形式的选择器都可以,并集选择器是多个选择器通过逗号连接⽽成的,
格式如:h1,h2,h3{color:red;font-size:23px;}
2.2后代选择器:
后代选择器书写⽅法:把外层的标记写在前⾯,内层的标记写在后⾯,之间⽤空格分隔,当标记发⽣嵌套时,内层的标记就成为外层标记的后代了
举个列⼦
<html>
<head>
<title>后代选择器</title>
<style type="text/css">
p span{
color:red
}
span
{
css选择器分为哪几类color:blue;
}
</style>
</head>
<body>
<p>
嵌套<span>⽤CSS</span>
标记的⽅法
</p>
嵌套之外的<span>标记</span>不⽣效
</body>
</html>
效果是:“⽤CSS”的显⽰红⾊,其他⽤<span>包围起来的是蓝⾊
后代选择器产⽣的影响不仅限于元素的“直接后代”,⽽且会影响到它的“各级后代”
⼦选择器:也就是只有对直接后代有影响的选择器,⽽对“孙⼦”以及对个层的后代不产⽣作⽤。
格式如下:p>span{color:blue;}
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论