CSS叠层样式的类型有哪些

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

CSS叠层样式的三种类型：1、行内样式，将样式代码写在HTML标签的style属性中；2、内嵌样式，将样式代码写在页面“<style>”和“</style>”标签对之间；3、外部样式，将样式代码写在独立的“.css”文件中。

本教程操作环境：windows7系统、CSS3&&HTML5版、Dell G3电脑。

为了让网页元素的样式更加丰富，也为了让网页的内容和样式能拆分开，CSS由此思想而诞生，CSS是 Cascading Style Sheets 的首字母缩写，意思是层叠样式表。有了CSS，html中大部分表现样式的标签就废弃不用了，html只负责文档的结构和内容，表现形式完全交给CSS，html文档变得更加简洁。

CSS主要用来设计网页的样式，美化网页；它不仅可以静态地修饰网页，还可以配合各种脚本语言动态地对网页各元素进行格式化。

CSS 能够对网页中元素位置的排版进行像素级精确控制，支持几乎所有的字体字号样式，拥有对网页对象和模型样式编辑的能力。

css样式主要包含三种类型：行内样式（内联样式) 、内部样式（内嵌样式）、外部样式（外联样式）。

1、行内样式：

结构的内部，即写在标签内的样式；写在标签的开始部分内部，style属性当中。

例：

<标记 style="样式的属性名1：样式的属性值1；属性名2：属性值2；......"></标记>

2、内部样式（内嵌样式）：

写在HTML页面内部，存放于head标记当中，样式写在style标记内。

例：

<style>
选择器 {属性名：属性值；属性名：属性值；......}
</style>

3、外部样式（外联样式）：

外联式是将所有的样式放在一个或多个以.css为扩展名的外部样式表文件中。一个 CSS 样式表文档就表示一个外部样式表。

外部样式表必须导入到网页文档中，才能够被浏览器识别和解析。外部样式表文件可以通过两种方法导入到 HTML 文档中。

1）、使用 <link> 标签导入

使用 <link> 标签导入外部样式表文件：

<link href="css文件路径" rel="stylesheet" type="text/css" />

对各个属性的说明：

• href 属性设置外部样式表文件的地址，可以是相对地址，也可以是绝对地址。

• rel 属性定义关联的文档，这里表示关联的是样式表。

• type 属性定义导入文件的类型，同 style 元素一样，text/css表明为 CSS 文本文件。

2）、使用 @import 关键字导入

在 <style> 标签内使用@import关键字导入外部样式表文件：

<style type="text/css">
@import url("css文件路径");
</style>

在 @import 关键字后面，利用 url() 函数包含具体的外部样式表文件的地址。

感谢各位的阅读！关于“CSS叠层样式的类型有哪些”这篇文章就分享到这里了，希望以上内容可以对大家有一定的帮助，让大家可以学到更多知识，如果觉得文章不错，可以把它分享出去让更多的人看到吧！