内部样式表、外部样式表、内联样式表

95 阅读 0 评论 63 点赞

我是靠谱客的博主爱听歌手链，最近开发中收集的这篇文章主要介绍内部样式表、外部样式表、内联样式表，觉得挺不错的，现在分享给大家，希望可以做个参考。

概述

外部样式表：

　　当样式需要应用于很多页面时，外部样式表将是理想的选择。在使用外部样式表的情况
你可以通过改变一个文件来改变整个站点的外观。每个页面使用 <link> 标签链接到样式表
，其书写格式为<link rel="stylesheet"type="text/css"href="xxx.css"

　　内部样式表：

　　当单个文档需要特殊的样式时，就应该使用内部样式表。你可以使用 <style> 标签在文
档头部定义内部样式表，就像这样:

<head> 
<style type="text/css"> 
h1 {color: sienna;} 
body{background-color:black} 
</style> 
</head>

　　内联样式表：

　　由于要将表现和内容混杂在一起，内联样式会损失掉样式表的许多优势。请慎用这种方法
，例如当样式仅需要在一个元素上应用一次时。要使用内联样式，你需要在相关的标签内使用
样式（style）属性。
<h1 style="color:red">helloworld></h1>

　　内部样式表与外部样式表区别：

　　内部样式和外部样式本质上没有什么区别，但是内部样式只供本页面使用，而外部样式可
以通过链接样式表的方式，可供多个页面使用，而且方便管理。外部样式如果链接到多个页面
，浏览器只需加载一次，而且页面相同地方出错，只需修改外部样式，且只需修改一；如果以
内部样式的方式写到多个页面中，那每打开一个页面浏览器就要加载一次，占用流量，页面相
同地方出错，需一个一个页面修改，工作量大，比较烦琐，容易出错。外部样式表里还可以链
接其它外部样式表。

　　注：三者的优先级为：内联样式>内部样式>外联样式。