HTML中如何引入CSS?有几种方法?

2021-03-12 16:22:32 浏览数 (62)

我们用 HTML 编写网页后,需要用 CSS 对某些样式进行优化,美化页面,提高体验度。那么 HTML 中如何引入 CSS 呢?有几种方法引入呢?这篇文章为你解答。

行内引入

直接在标签中加入 CSS 样式。若使用此方法过于繁琐,且没有体现 CSS 样式。故较少用此方法。

<p style="color:red">行内引入CSS样式</p>

嵌入引入

对页面中涉及到的样式集中写在​<head></head>​之间,所有的 CSS 样式都是针对本页面标签的,没有多余的命令,而且直接 HTML 文档中读取样式,页面加载速度会更快。但是此方法缺点也存在,不方便修改,代码过多,后续排查时需要花费较多心思,不好维护。

<style type=”text/css”>

p{ color:red }

</style>

导入文件引用

<!-- 导入外部样式:在内部样式表的<style></style>标记之间导入一个外部样式表,导入时用@import。 -->  
<style type="text/css">  
 @import "jisuan.css";  
</style>

链接导入

链接导入与导入式差不多,都是从外部引入 CSS。当客户端用户浏览网站时,链接导入效果会好一点。目前常用的导入方式也是链接导入,这种方式也是最能体现 CSS 特点的方式,也方便日后维护。

<link href="文件地址" rel=”stylesheet” type=”text/css” />

以上就是 HTML 中如何引入 CSS 以及有几种方法的全部解答。

1 人点赞