首页 / 知识
在HTML中有哪些引用CSS的方式
2023-04-11 15:06:00
在HTML中，引入CSS的方法主要有行内式、内嵌式、导入式和链接式
行内式：即在标记的style属性中设定CSS样式，这种方式本质上没有体现出CSS的优势，因此不推荐使用
例：
<html>
<head>
<metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/>
<title>TextDemo</title>
</head>
<body>
<h1style=color:white;background-color=blue;>
ThisisalineofText.
</h1>
</body>
</html>
嵌入式：嵌入式则将对页面中各种元素的设置集中写在<head>和</head>之间，对于单一的网页，这种方法很方便。但是对于一个包含很多页面的网站，如果每个页面都以内嵌方式设置各自的样式，就失去了CSS带来的巨大优点，因此一个网站通常都是编写一个独立的CSS样式表文件，使用以下两种方式中的一种，引入HTML文档中。
例：
<html>
<head>
<metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/>
<title>TextDemo</title>
<styletype="text/css">
h1{
color:white;
background-color:boue;
}
</style>
</head>
<body>
<h1>ThisisalineofText.</h1>
<h1>ThisisanotherlineofText.</h1>
</body>
</html>
导入式与链接式：导入式和链接式的目的都是将一个独立的CSS文件引入HTML文件，二者有相应的区别。
事实上，二者最大的区别在于链接式使用HTML的标记引入外部CSS文件，而使用导入式则是使用CSS的规则引入外部CSS文件。因此它们的语法也不同。
如果使用链接式，需要使用如下语句引入外部CSS文件。
<linkhref="mystyle.css"rel="stylesheet"type="text/css"/>
如果使用导入式，则需要使用如下语句。
<styletype="text/css">
@import"mystyle.css";
</style>
此外，采用这两种方式后的显示效果也略有区别。使用链接方式时，会在装置页面主体部分之前装载CSS文件，这样显示出来的网页从一开始就是带有样式的效果，而使用导入式时，会在整个页面装载完成后再装载CSS文件，对于有的浏览器来说，在一些情况下，如果网页文件的体积比较大，则会出现先显示无样式的页面，闪烁一下之后再出现样式设置后的效果。从浏览者的感受来说，这是使用导入式的一个缺陷。对于一些比较大的网站，为了便于维护，可能会希望把所有的CSS样式分类别放到几个CSS文件中，这样如果使用链接式引入，就需要几个语句分别导入CSS文件。如果要调整CSS文件的分类，就需要同时调整HTML文件。这对于维护工作来说，是一个缺陷。如果使用导入式，则可以只引进一个总的CSS文件，在这个文件中再导入其他独立的CSS文件；而链接式则不具备这个特征。
因此这里给大家的一个建议是，如果需要引入一个CSS文件，则使用链接方式；如果需要引入多个CSS文件，则首先用链接方式引入一个“目录”CSS文件，这个“目录”CSS文件中再使用导入式引入其他CSS文件。
如果希望通过JavaScript来动态决定引入哪个CSS文件，则必须使用链接方式才能实现。
本文转载自中文网 |
最新内容
相关内容
python如何读取列表中元素的位置?
python如何读取列表中元素的位置?，位置，数据，异常，培训，字符串，元素，索引，方法，示例，结果，python读取列表中元素位置的方法：1、使用index()方
python使用matplotlib绘图怎么在线
python使用matplotlib绘图怎么在线上标注?，地方，培训，坐标轴，图像，范围，画图，示例，注释，文字描述，以上，python画图常用标注包含，坐标轴的值和
python3中怎么编写类?
python3中怎么编写类?，培训，方式，步骤，关键字，以上，过程，方法，更多，内容，python中创建类的方法：方式一：利用class关键字classChinese(object):
python中获取路径的三种方法
python中获取路径的三种方法，工作，代码，情况，培训，下来，路径，文件，也就是，桌面，目录，python中获取路径总结下来分为三种情况：1、获取工作目录
python如何调用另一个文件夹中的内
python如何调用另一个文件夹中的内容?，系统，培训，文件，模块，内容，路径，函数，所在，前缀，语句，python中调用另外一个文件夹中的内容：1、同一文件
python中怎么对一个数进行因式分解
python中怎么对一个数进行因式分解?，代码，培训，因式分解，因数，个数，最小，整数，数组，假定，分解，1、Python因式分解代码：importtime#对一个数进python中函数怎么表示?
python中函数怎么表示?，名称，标准，培训，代码，函数，圆括号，字符串，表达式，选择性，自变量，python中函数定义规则：·函数代码块以def关键词开头，后
python怎么找出所有的数字?
python怎么找出所有的数字?，数字，培训，代码，小数点，小数，字符串，整数，表达式，含义，思路，python中获取字符串中所有数字的方法：1、使用正则表达
chr在python中怎么用?
chr在python中怎么用?，数字，培训，整数，字符，参数，示例，语法，范围，形式，以上，python中chr()用一个范围在range(256)内的(就是0～255)整数作参数，
python中怎么样进行矩阵运算?
python中怎么样进行矩阵运算?，矩阵，培训，数据，数值，行列，函数，开头，元素，以上，时候，python的numpy库提供矩阵运算的功能，因此我们在需要矩阵运
Python怎么取出列表中的相邻元素?
Python怎么取出列表中的相邻元素?，代码，异常，培训，元素，指针，序列，对象，表示，语句，函数，1、python的迭代器。iter()能把一个序列生成为一个和python怎么在数组添加一行?
python怎么在数组添加一行?，培训，下标，维度，数组，列表，函数，形状，元素，代表，原型，python中在数组添加一行的方法：python中可以使用stack()函数