css里面的@import

@import

说明

  1. 用于从其他样式表导入样式规则。可以是绝对或相对路径,也可以是一个在线的url地址。
  2. @import 规则必须在 CSS 文档的头部,但可以在 @charset 规则后面。
  3. @import 规则不是一个嵌套语句,@import不能在条件组的规则中使用。
  4. @import 规则还支持媒体查询,因此可以根据不同屏幕尺寸导入不同的样式文件。

参数

url:他有两种表现形式。

  1. 可以是一个字符串指定的文件路径,也可以是一个在线的url地址。
    @import "../../assets/css/iconfont.css";
    
  2. 2.可以使用url()方法引入
    @import url("../../assets/css/iconfont.css");
    

list-of-media-queries:是一个逗号分隔的 媒体查询 条件列表,决定通过 URL 引入的 CSS 规则 在什么条件下应用。如果浏览器不支持列表中的任何一条媒体查询条件,就不会引入 URL 指明的 CSS 文件。

扩展

需要注意的是@import其实是全局引入的,即使你放在scoped属性包含的style标签里面,他依旧会被注册为全局样式。如果你真的想要引入一个css文件并只将其作为局部样式使用,可以添加一个style标签使用其src属性

<style src="../../assets/css/iconfont.css" scoped></style>

猜你喜欢

转载自blog.csdn.net/qq_44473483/article/details/134596494