css的四种引入方式
一、行内样式
别名：行间样式、内联样式
写法：在网页元素上通过style=””属性
<div style="color: pink; margin-top: 10px;border: 1px solid blue">行内样式</div>
二、内部样式表
写法：在网页创建嵌入的样式表，写在里面
<head>
<style>
p{
color:pink;
border:blue 1px solid;
}
</style>
</head>
三、链入外部样式表
写法：网页引入外部样式表，外部创建一个css文件，在html中通过连接这个css文件，一般写在css前面
<link rel="stylesheet" type="text/css" herf="1.css">
四、导入外部样式表
写法：通过@import 引入，不建议开发使用
<style>
@import"1.css";
</style>
五、css引用的优先级
- 记住就近原则
- 内部样式、、@import都出现在HTML的里面，就近原则，距离修改元素近的优先级高
- 行内样式>内部样式>link>@import
建议开发中链入外部样式，无需改动HTML结构，有利于代码的维护，开发效率高
六、link和@import的区别
1、引入的内容不同
link引入样式文件、图片资源等，而@import只引入样式文件
2、加载的顺序不同
link在页面加载的同时加载，@import在页面加载以后加载
3、兼容性不同
link是XHTML标签，没有兼容性问题，@import在css2.1提出，低版本的浏览器不支持
4、对js的支持不同
link支持js控制dom去改变样式，@import则不能支持
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 举报，一经查实，本站将立刻删除。
文章由极客之音整理，本文链接：https://www.bmabk.com/index.php/post/16155.html
