CSS中常用样式有哪些

  介绍

这篇文章给大家分享的是有关CSS中常用样式有哪些的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。

CSS样式表:

作用:设定如何显示HTML标签
语法结构:

第一种:选择器{
,,,,样式属性声明,
,,}说明:这种方式的CSS样式表由选择器及一条或多条声明两个部分组成;该种样式表只能定义在风格标签或CSS文件中,每个风格标签或CSS文件可定义多个样式表
第二种:风格=把绞粜陨?;样式属性声明2;……“说明:这种方式的CSS样式表只由一条或多条声明组成;该种样式表只能定义在风格标签属性;HTML文档中每个标签都有一个风格标签属性

无论使用哪一种方式定义CSS样式表,样式表中的样式属性声明都由一个样式属性(非标签属性,即样式属性不能当标签属性直接用在标签中)和一个样式属性值组成,样式属性和样式属性值使用冒号分开;声明之间使用分号间隔

注意:1。如果一个样式属性有多个样式属性值,则样式属性值之间用逗号间隔
2。在CSS中样式属性及其样式属性值对大小写不敏感,且不忽略空格
3。如果属性值由多个单词组成,则建议使用单引号引起来

选择器:

<强>标签选择器:强标签选择器以HTML文档中定义的标签名为选择器名,其语法如下:

标签名{   ,,,样式属性声明1;,,,,…}

作用对象:HTML文档中标签名与标签选择器名相同的所有标签都会受影响
<强>类选择器:类选择器以标签中类标签属性的属性值为选择器名,其语法如下:

.class ,标签属性的属性值{   ,,,样式属性声明1;,,,,…}

作用对象:类标签属性的属性值与类选择器。后相同的标签都受影响,注意:类标签属性不能与数字开头
<强> id选择器: id选择器以标签中的id标签属性的属性值为选择器名,其语法如下:

# id 标签属性的属性值{   ,,,样式属性声明1;,,,,…}

作用对象:只有id标签属性的属性值与id选择器#后相同的标签才受影响。注意:id标签属性的属性值不能以数字开头;id标签属性的属性值在HTML文档中必需唯一、课标签属性的属性值可以不唯一
<强>后代选择器:

语法:父代选择器1,子父代选择器2,子父代选择器3…子代选择器{   ,,,,,,,样式属性声,明1;,,,,,,,,…   ,,,}

注意:选择器之间用空格间隔
<强>分组选择器:强如果HTML文档多个CSS样式表内的部分样式相同,则可以通过定义一个分组选择器抽取出来以简化CSS样式代码,该类选择器的选择器名由多个选择器组成,使用逗号分隔,其语法如下:

选择器1,选择器2,选择器3…{   ,,,样式属性声明,,,,,…}

<>强通配符选择器:强通配符选择器等价于列出了HTML文档中所有标签的一个分组选择器,其语法如下:

* {   ,,,样式属性声明1;,,,,…}

如何使用CSS样式

在HTML中插入CSS样式有三种方式:外部样式表,内部样式表,内联样式
<强>外部样式表:当多个HTML文档中某些标签的样式规则相同时,为了实现这些样式表的重用,同时也为了方便管理样表式1,会将CSS样式写在CSS样式文件中,载用链接标签将该CSS文件引入到HTML文档中,
补充:链接标签还用于设置HTML文档头部小图标,语法结构:& lt;链接rel="快捷方式图标" type="图像/x图标" href=https://www.yisu.com/zixun/蓖计肪?/>

<强>内部样式表:当一个HTML文档中的样式在其他HTML文档中不具有共性,但本HTML文档中的多个标签的样式相同,这时为了实现这些样式规则的重用,同时也为了方便管理样式规则,则需要将CSS样式直接写在HTML文档的风格标签内

<强>内联样式:当一个HTM L文档中的某个标签样式与其他标签样式不同或该文档中的标签样式与父标签样式不统一时,讲CSS样式写在HTML文档某个标签的风格标签属性的属性值中

CSS样式优先级

<强>选择器优先级: id选择器祝辞类选择器在标签选择器,且选择器优先级不考虑选择器的先后顺序

<强>样式插入方式优先级:强如果按照一般插入CSS样式的顺序(即先使用链接插入外部样式表,再使用风格标签插入内部样式表,最后再在风格标签属性中插入内联样式)来说,优先级内联样式祝辞内部样式表祝辞外部样式表

常用CSS样式属性

CSS中常用样式有哪些