通常我们想引入css样式,有很多方法,这令刚做项目时的我感到困惑。通过自己的查询,终于得到了答案,在此记个笔记,与前端小伙伴们分享一下。
让我们一起来看一下,他们有什么不同呢?
1. style 引入
style标签是放到html的head标签内部的,它是定义在当前页面的样式
#outer {
width: 300px;
height: 300px;
border: 1px solid #000;
}
2. link 标签
link引入外部独立css文件
3. @import
@import 只能加载css,或者less
@import url('./base.css');
@import "./styles/layoutStyles/button.less";
@import 和 link 的区别
link 在载入页面的同时,加载css样式。而@import在页面载入完成后才加载csslink的兼容性比css要好@import只能导入样式文件,link不仅可以同href导入样式,还可以定义rel属性(规定当前文档与被链接文档之间的关系)。
有问题可以给我留言,如果对你有了帮助,顺手点个赞,谢谢。