对外css

大家好，今日小科来聊聊一篇关于如何对外介绍css的文章，现在让我们往下看看吧！

引入外部css的方法：1。使用link调用外部css文件，标签定义文档与外部资源的关系；2.使用@import引用外部CSS文件。

如何引入外部css？

方法1:使用链接调用外部css文件。

在网页的head/head标记对中，使用链接标记引入外部样式表文件，并使用html规则引入外部css。

链接标签定义了文档和外部资源之间的关系。链接标签最常见的用途是链接样式表。

语法：

链接rel='样式表' href='https://www.xhjyxxw.com/keji/202308/css文件路径' type=' text/css '/链接外部CSS样式时链接标记的内容结构说明：

Href:是外部资源的地址，这里是css的地址。

Rel:定义当前文档和链接文档之间的关系，这里是外部css样式表，或样式表。

Type:指定链接文档的MIME类，其中的值为text/css。

描述：

这个方法在网页文件主体加载之前加载CSS文件，所以显示的网页从一开始就有样式的效果。它不会先显示没有样式的网页，然后像导入的网页一样显示样式化的网页。

方法2:使用@import引用外部CSS文件。

CSS @import rule，用于从其他样式表中导入样式规则。这些规则必须优先于所有其他类型的规则。@import不能用于条件组的规则中。

@导入规则语法

@导入url('文件路径')；描述：

这种方法会在整个网页加载后加载CSS文件，导致出现问题。如果网页很大，它会先显示没有样式的页面，然后网页的样式会在一瞬间出现。这是进口的固有缺陷。

调用外部css样式的两种方法之间的区别：

@import是CSS提供的语法规则，只服务于导入样式表；链接HTML提供了一个标签，不仅可以加载CSS文件，还可以定义RSS、rel连接属性等。

页面加载时，同时加载链接标签引入的CSS@import引入的CSS会在页面加载后加载。

@import是只有CSS2.1才有的语法，所以只能在IE5中识别。链接标签是HTML元素，不存在兼容性问题。

可以通过JS操作DOM，插入链接标签改变样式；因为DOM方法是基于文档的，所以不能使用@import来插入样式。

link引入的样式的权重大于@import引入的权重。

这篇好文章是转载于：知行礼动