HTML插入CSS样式表方法总结

简介

在HTML中插入CSS的方法主要有三种，它们分别是内联样式、内部样式、链接式和外部样式。本文结合的具体的例子，总结HTML插入CSS的方法。

内联样式

内联样式是在标记的style属性中设定CSS样式。如下面的例子将h1的内容标记为黑底白字。

		This is a line of Text.

由于要将表现和内容混杂在一起，内联样式会损失掉样式表的许多优势。这种方式仅设置某个具体标记，无法与其它标记共用，没有体现出CSS的优势，不推荐使用。

内部样式表

内部样式是将CSS样式集中写在网页的标签对的标签对中。如对本网页所有的h1标记都设置为黑底白字：

这种方法的 缺点是对于一个包含很多网页的网站，在每个网页中使用嵌入式，需要维护很多份样式表，这种情况下，样式的修改和维护非常麻烦，耗时耗力。 当单个文档需要特殊的样式时，就应该使用内部样式表。

外部样式表

当样式需要应用于很多页面时，外部样式表将是理想的选择。在使用外部样式表的情况下，你可以通过改变一个文件来改变整个站点的外观。CSS样式定义在.css文件中，可以通过一定的规则在HTML页面中进行引用，这种又分为两种方式：

导入式

导入式使用 CSS规则引入外部.css文件，语法如下：

导入式会在整个网页装载完后再装载CSS文件，因此这就导致了一个问题，如果网页比较大则会儿出现先显示无样式的页面，闪烁一下之后，再出现网页的样式。这是导入式固有的一个缺陷，因此这种方式也很少被使用。

链接式

链接式使用 HTML规则引入外部CSS文件，它在网页的标签对中使用标记来引入.css文件，使用语法如下：

使用链接式时，会在网页文件主体装载前装载CSS文件。因此，显示出来的网页从一开始就是带样式的效果的，它不会象导入式那样先显示无样式的网页，然后再显示有样式的网页，这是链接式的优点。

总结

一般来说，推荐使用链接式外部样式表的方式， 这样，  在使用外部样式表的情况下，你可以通过改变一个文件来改变整个站点的外观。

参考资料

1. CSS彻底研究

2.  w3school: 如何创建CSS