其他分享
首页 > 其他分享> > 群组选择符和通用选择符

群组选择符和通用选择符

作者:互联网

 

在同一目录下创建h2.html文档

一.群组选择符

1.定义:

可以为 任意多种不同类型的选择符定义一个统一的样式。相当于对于各个选择符单独定义了完全相同的样式表。(标记名选择符,#id选择符,.class选择符,...{样式规则})

2.注意事项:

每个选择符后要使用  “ ,”   逗号隔开, 同时id选择符的 “#” 以及class选择符的  “.”  不能漏。

3.好处:

使用该选择符省时省力。我们以后敲写代码时,难免遇到大工程量,使用它后可以轻松许多,学习它也耽误不了多少

4.例子:

创立样式表文件c2.css

p, #first, .sec{color:red; background:yellow; font-size:10px;}

在同一目录下创建h2.html文档

<head>
<title></title>
<link href="c2.css"type="text/css" rel="stylesheet"/>
</head>
<body>
<p>黄色背景 红色字体 粗细为10像素</p>
<div class="sec">黄色背景 红色字体 粗细为10像素</div>
<div id="first">黄色背景 红色字体 粗细为10像素</div>
</body>

如果是:p,h3{样式规则},则表明该样式表对页面的<h3><p>标记都有效

二.通用选择符

1.定义

用通配符 “ * ” 表示任意标记,为页面中的所有元素定义通用的样式规则,(    * {样式规则}   )

2.注意事项:

值得注意的是:该方式定义的样式表对所有的标记都有效,包括<body>

3.例子:

创立样式表文件c2.css  并在同一目录下创建h2.html文档

* {font-family:宋体;font-weight:bold;text-align:fight}
<head>
<title></title>
<link href="c2.css"type="text/css" rel="stylesheet"/>
</head>
<body>
<p> 宋体加粗右对齐黄色背景 红色字体 粗细为10像素</p>
<div  class="sec">宋体加粗右对齐 黄色背景黄色背景 红色字体 粗细为10像素</div>
<div id="first">宋体加粗右对齐 黄色背景黄色背景 红色字体 粗细为10像素</div>
</body>

后记:

二者可以同时使用,请依据 层叠优先级规则  使用,才能取得想要的效果

 

标签:10,通用,群组,像素,宋体,选择符,样式表,黄色
来源: https://blog.csdn.net/m0_52348906/article/details/113177889