@import

 引用CSS资源有两种方式,一种是link 一种是@import 

对于Link 但凡用过css的人应该都很了解了,今天说下css另外一种引用方式@import,@import可以在css文件中引入其他的css文件。

 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <link rel="stylesheet" href="css/css.css"/>
</head>
<body>
   <form class="form-horizontal">
    <h2 class="title">hello</h2>
    <div class='form-group'>
        <label for="inputEmail3" class="col-sm-2 control-label">Email</label>
        <div class="col-sm-10">
          <input type="email" class="form-control" id="inputEmail3" placeholder="Email">
        </div>
    </div>
   </form>
</body>
</html>
@import url("https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css");
h2{
	color: red;
}

 可以看出css只写了h2的样式,但是我们在css中又引入了bootstrap的css样式,于是我们就可以使用boostrap了。

最后总结:不要过多的使用@import 加载速度跟Link比不是一个等级的。

posted @ 2017-04-08 09:53  孤狼之森  阅读(241)  评论(0编辑  收藏  举报