当读到一个样式表时，浏览器会根据样式表来美化HTML页面
本文就对插入样式表的三种方法做介绍：
首先，先说一下三种方法为：外部样式表、内部样式表、内联样式
1、外部样式表
应用场景：当样式需要应用于很多页面的时候，就需要用到外部样式表。在外部样式情况下，你可以通过改变一个文件而改变整个网站的样式。
写法：每个页面使用<link>标签连接到样式表，
例如：
<head>
<link ref="stylesheet" type="text/css" href="style.css">
</head>
浏览器会从style.css中读取样式声明，并根据这个文件来美化HTML
外部样式表文件不能包含任何HTML标签，样式以.css作为扩展名进行保存
例如：
hr {color:sienna;}
p {margin-left:20px;}
body {background-image:url("/images/back40.gif");}
注意：不要在属性值与单位之间留有空格
p {margin-left:20px;} <!--正确的写法-->
p {margin-left:20 px;} <!--错误的写法-->
2、内部样式表
应用背景：当单个页面需要特使样式时，就需要使用内部样式表。
写法： 使用<style>标签在文档头头部定义内部样式表，就像这样：
<head>
<style>
hr {color:sienna;}
p {margin-left:20px;}
body {background-image:url("images/back40.gif");}
</style>
</head>
3、内联样式
这是一种将样式和内容混在一起写的样式，这样不便于统一维护，所以jingshen谨慎使用。
应用场景：当样式仅需在一个元素上应用一次的时候。
写法：在相应的标签中使用style属性，属性值为CSS属性，例如：
<p style="color:sienna;margin-left:20px">这是一个段落。</p>
多重样式
如果即使用了外部样式又使用了内部样式，那具体使用哪个呢?这就是多重样式
例如：
外部样式：
h3
{
color:red;
text-align:left;
font-size:8pt;
}
内部样式：
h3
{
text-align:right;
font-size:20pt;
}
同样的标签，内部有两个属性，外部多一个color，这种情况下，内部样式会继承外部样式的样式，但是和自己属性相同的部分，内部样式会覆盖外部样式，也就是说，上述同时使用了外/内部样式的文件，具体表现的样式为：
最终样式：
h3
{
color:red;
text-align:right;
font-size:20pt;
}
color继承了外部样式，因为内部样式没有这个属性，其他名称相同的两个属性（text-align/font-size）用了自己的样式
多重样式的优先级：
内联样式 > 内部样式 > 外部样式 > 浏览器默认样式
注意：如果外部样式放到内部样式后面，则外部样式覆盖内部养样式！！！！
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
