css的四种使⽤⽅式
⽅式⼀：内联样式
内联样式，也叫⾏内样式，指的是直接在style属性中添加CSS
⽰例:
<DIV ></DIV>
不建议使⽤这种⽅式，它只能改变当前标签的样式，如果想要多个<DIV>拥有相同的样式，你不得不重复得为每⼀个<DIV>添加相同得样式如果想要修改⼀种样式,⼜不得不修改所有style中的代码，很显然，内联⽅式的使⽤会导致HTML代码变得冗长，使得⽹页难以维护.
⽅式⼆：嵌⼊样式
嵌⼊⽅式是指的在HTML中的<style>标签中书写CSS代码
⽰例:
<head>
html href属性
<style>
.content {
background: red;
}
</style>
</head>
嵌⼊式的CSS只对当前⽹页有效，因为CSS代码是在HTML⽂件中，所以会使得代码⽐较集中，当我们写模板⽹页时会⽐较有利，因为查看模板代码的⼈可以⼀⽬了然的的查看HTML结构和CSS样式，因为嵌⼊的CSS只对当前的HTML⽂件有效，所以当多个页⾯要使⽤相同的CSS代码时，这样写会导致代码冗余，当页⾯较多时也不利于维护
⽅式三：链接样式
链接⽅式是指在HTML引⼊外部的CSS⽂件
⽰例:
<head>
<link rel="stylesheet" type="text/CSS" href="style.CSS">
</head>
这是最常见的也是最推荐的引⼊CSS样式，使⽤这种⽅式，所有的CSS代码只存在单独的CSS⽂件中，所以具有良好的维护性.并且CSS代码只存在于CSS⽂件中CSS⽂件会在第⼀次加载时引⼊，以后切换页⾯时只需要加载HTML⽂件
⽅式四：导⼊样式
导⼊样式指的是使⽤CSS规则引⼊外部的CSS⽂件
⽰例:
<style>
@import url(style.CSS);
</style>
或者写在CSS 样式中
@charset "utf-8";
@import url(style.CSS);
*{ margin:0; padding:0;}
.notice-link a{ color:#999;}
⽐较导⼊⽅式与链接⽅式
link是属于HTML，通过<link>标签中的href属性来引⼊外部⽂件,⽽@import属于CSS导致语句应该写在CSS中，并且写在CSS的头部，否则⽆法正确的导⼊外部⽂件;
@import是CSS2.1才出现的概念，所以如果浏览器版本⽐较低,⽆法正确导⼊外部样式⽂件
当HTML⽂件被加载时,link引⽤的⽂件会同时被加载,⽽@import引⽤的⽂件会等页⾯加载完成后再被加载,
建议：尽量使⽤<link>标签导⼊外部CSS⽂件，避免或者少使⽤其他的三种⽅式

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。