CSS选择器的常用规则
CSS选择器的常用规则
(1)组规则
语法：选择符1，选择符2，...，选择符n{属性1：值1；属性2：值2；...；属性n:值n；}
示例：
/*定义H1的格式*/
H1 {
font-weight: bold;/*字体的粗细，bold指粗体*/
font-size: 12pt;/*字体尺寸，现在一般使用px，并不使用pt*/
font-family: helvetica;/*字体类型，如宋体、黑体*/
font-variant: normal;/*设置小型大写字母，normal为正常。*/
font-style: normal;/*字体风格，例如斜体。normal代表标准字体。*/
}（2）继承规则
当对一个HTML标签定义了CSS样式后，样式会自动继承给这个节点的所有子节点。
（3）类规则
通过“.”+类名对该类进行定义。
示例：
<!--通过类名设置标题的颜色-->
.list{color: red;}
<body>
<h1 class="list">标题1</h1>
<h1 class="list">标题2</h1>
<h1 class="list">标题3</h1>
</body>（4）ID规则
通过“#”+ID号对该元素进行设置。
示例：
#header{
width: 800px;
height: 125px;
color: red;
}
<body>
<div id="header">顶部横条</div>
</body>（5）嵌套规则
嵌套规则可以指定一个路径来定义一个样式，规则中的选择符可以是类、ID或者基本选择符。
实例1：
<!-- 设置类“.reddish”的标签中的H1标签的样式 -->
.reddish h1{
color: red;
}
<body>
<div class="reddish">
<h1>标题1</h1>
</div>
</body>示例2：
<!-- 改变继承关系 -->
p{color: red;}
p b{color: blue;}
<body>
<p>
红色
<b>蓝色</b>
</p>
</body> 相关推荐
jiedinghui 2020-10-25
葉無聞 2020-09-01
buttonChan 2020-08-02
drdrsky 2020-07-05
sdbxpjzq 2020-06-25
xiaohuli 2020-06-17
teresalxm 2020-06-13
葉無聞 2020-07-05
opspider 2020-06-28
zhanghaibing00 2020-06-28
opspider 2020-06-26
somboy 2020-06-26
zhanghaibing00 2020-06-14
牵手白首 2020-06-14
覆雪蓝枫 2020-06-09