首页 > Web开发 > 详细

在HTML中导入外部的css

时间:2019-03-11 23:53:26      阅读:90      评论:0      收藏:0      [点我收藏+]

标签:port   sheet   加载完成   导入   需要   ref   mce   test   html文档   

1,标签:<link type="text/css" rel="stylesheet" href="CSS样式文件的绝对地址">

它只能位于HTML文档的head标签内,且必须有href属性,用于指定需要引入的CSS文件的绝对路径。

2.1:在style元素中导入CSS文件

<style type="text/css">
    @import "CSS样式文件的绝对地址";
    @import url("样式文件的绝对地址");
</style> (url可省略,所以只需指定样式单地址即可)

2.2在CSS文件中再导入CSS文件

@import "另一个CSS文件的地址";

.test{
width: 100px;
height: 100px;
line-height: 20px;
background-color: red;
}
(在CSS文件中再导入CSS文件,会给服务器造成太大的文件请求压力,最好不要这样做。) 
@import是由CSS提供的一种导入样式的方式,当页面被加载时,@import会等到页面全部被加载完成时再加载CSS样式,所以在页面还未加载完成期间,页面还没有CSS样式效果,会导致“屏闪”,通过@import导入的CSS样式是无法用DOM去控制的。

在HTML中导入外部的css

标签:port   sheet   加载完成   导入   需要   ref   mce   test   html文档   

原文:https://www.cnblogs.com/lq13035130506/p/10513980.html

(0)
(0)
   
举报
评论 一句话评论(0
0条  
登录后才能评论!
© 2014 designnerd.net 版权所有 鲁ICP备09046678号-4
打开技术之扣,分享程序人生!
             

鲁公网安备 37021202000002号