今天小编跟大家讲解下有关css样式的引入方式总汇 ，相信小伙伴们对这个话题应该有所关注吧，小编也收集到了有关css样式的引入方式总汇 的相关资料，希望小伙伴们看了有所帮助。
首选来介绍一下什么是css?(英文全称：Cascading Style Sheets)是一种用来表现html(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言,其实就是一种层叠样式表。css不仅可以静态地修饰网页，还可以配合各种脚本语言动态地对网页各元素进行格式化。css能够对网页中元素位置的排版进行像素级精确控制，支持几乎所有的字体字号样式，拥有对网页对象和模型样式编辑的能力。
就像造房子一样，如果html是基地的话，那么css就是装修，只有装修的房子才可以住，自然至于那些灯光之类的是js了，这是简单的比例，但也说明了css的重要性。网页的核心就是内容与样式的分离，其中css就是分离的一种，那么如果分离了，该如何引用呢?一些网站中很多文件，只有相关的引用才可以实现，其中有四种方式，内链样式，嵌入式样式，外部样式，导入样式，下面为大家介绍一下：
1：内联样式(行间样式)：在标签的style属性添加样式：
<!DOCTYPE><html><head> <meta charset="utf-8"/> <title>行内样式</title></head><body> <!--使用行内样式引入css--> <h1 style="color:red;">惊风随笔</h1> <p style="color:red;font-size:30px;">惊风随笔</p></body></html>2、嵌入式样式表(内部样式表)：在style标签内添加(加在head标签内部)
<html><head> <meta charset="utf-8"/> <title>内部样式表</title> <!--使用内部样式表引入css--> <style type="text/css"> div{ background: green; } </style></head><body> <div>我是div</div></body></html>3.外部样式表：将css样式编写在扩展名为.css的文件中，再导入样式，导入在(head标签内部)
<!DOCTYPE><html><head> <meta charset="utf-8"/> <title>外部样式表</title> <!--链接式:推荐使用--> <link rel="stylesheet"type="text/css"href="http://www.aidi.net.cn/article/detial/4365/css/style.css"/> </style></head><body> <ul> <li>html</li> <li>CSS</li> <li>Javascript</li> </ul></html>[email protected]中包含被导入的css文件中的样式。
<!DOCTYPE><html><head> <meta charset="utf-8"/> <title>导入样式表</title> <!--导入式-不推荐使用--> <style type="text/css"> @import url("css/style.css"); </style></head><body> <ul> <li>HTML</li> <li>CSS</li> <li>Javascript</li> </ul></html>不过根据目前网站的做做法，要做到内容与样式的分离，一般都是使用第三种的做法，也就是使用外部式表。这是通用的方式了，第四种一般很少用，因为需要进一步的加载，不利于后期seo的优化。
来源：爱蒂网
