CSS页⾯控制⽅式及其优先级--⾏内样式、内嵌式、链接式、导⼊式
使⽤CSS对页⾯进⾏全⽅位的控制，控制页⾯的⽅式：⾏内样式，内嵌式，链接式，导⼊式。
⾏内样式：
直接对HTML的标记使⽤style属性，然后将CSS代码直接写进去；
<p >范晓权</p>
内嵌式：
将CSS写在<head>与</head>之间，并且⽤<style>和</style>标记进⾏声明；
<head>
<style type="text/css">
<!--
p{
  color:#0000FF;
  text-decoration:underline;
  font-weight:bold;
  font-size:18px;
}
-->
</style>
</head>
略显⿇烦，维护成本⾼，因此仅适⽤于对特殊的页⾯设置单独的样式风格。
链接式：使⽤频率最⾼，最为实⽤的⽅法。
在⽂件<head> 和 </head> 标记之间加上<link href = "sheet.css" type = "text/css" rel = "stylesheet" > ，将CSS⽂件链接到页⾯中，对其中的标记进⾏样式控
制。它将HTML页⾯本⾝与CSS样式风格分离为两个或者多个⽂件，实现了页⾯框架HTML代码和美⼯CSS代码的完全分离。
最⼤优势：CSS代码和HTML代码完全分离，并且同⼀个CSS⽂件可以被不同的HTML所链接使⽤。
前期制作和后期维护都⽅便，⽹站后台技术⼈员和美⼯设计者有很好的分⼯合作；对于同⼀个CSS⽂件可以链接到多个HTML⽂件中，甚⾄是所有页⾯，⽹
站风格统⼀，协调，后期维护量⼤⼤减少。
导⼊样式：
与链接样式表的功能基本相同，仅在语法和运作⽅式上与链接样式表略有区别；
采⽤import⽅式导⼊的样式表，在HTML⽂件初始化时，会被导⼊到HTML⽂件内。⽽链接样式表则是在HTML的标记需要格式时才以链接的⽅式引⼊；
格式种类：
@import url(sheet1.css);
@import url("sheet1.css");
@import url('sheet1.css');
@import sheet1.css;
@import "sheet1.css";
@import 'sheet1.css';
<head>
<style type="text/css">
<!--
<span >    @import url(sheet1.css);</span>
textstyle-->
</style>
</head>
各种⽅式的优先级
⾏内样式>链接式>内嵌式>@import导⼊式
PS：在<style> 与 </style>之间会⽤到 " <!-- " 和 “ --> ”将所有的CSS包含在其中，避免⽼式浏览器不⽀持CSS，将CSS代码直接显⽰在浏览器上⽽设置的
HTML注释；
总结：
学习的是为了使⽤，⽽熟悉了各种使⽤⽅式的优缺点之后，能够在合适的地⽅选择合适的⽅式进⾏处理才是最优解。链接式是我们经常见到和使⽤的，在学习和使⽤CSS的使⽤应该

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