题目内容

引入CSS的方法

题目答案

在网页中，需要引用css，让它成为网页中的修饰工具。如何才能引用css来为页面服务呢？下面介绍在页面中应该如何引入css样式表。

在页面中引入css样式表时，有三种方法：内联引入方法、内部引入方法、外部引入方法。这三种方法分别是怎么执行引入的呢？

1.内联引入方法

每一个HTML元素都拥有一个叫做style的属性。它是用来控制元素的外观。特别之处就在于，在style属性里面写入的CSS代码都是作为HTML中style属性的属性值出现的。

2.内部引入方法

页面中有很多元素需要管理的时候，内联引入CSS样式很显然是不合适的，因为那样会产生很多重复性的搡作与劳动。例如，需要把页面中所有的<p>标签中的文字都改成红色，使用内联CSS的话，需要往每一个<p>里手动添加（在不考虑JavaScript的情况下），这样的重复劳动产生的劳动量是非常惊人的。很显然，程序员不可能让自己变成流水线上的机器人，所以可以把有相同需求的元素整理好并分成很多类别，让相同类别的元素使用同一个样式。

我们会在页面的<head>部分引入<style>标签，然后在<style>标签内部写入需要的CSS样式。例如，可以让<p>标签里的文字的颜色为红色，文字大小为20像素，<div>标签里文宇的颜色为绿色，文字大小为10像素。

力。这样的方式也更利于后期对代码和页面的维护工作。

3.外部引入方法

前面介绍了内联样式表和内部样式表，但是这两种样式表的写法并不推荐大家在开发当中使用。在开发中通常是一个团队的很多人在一起合作，项目的页面想必也不会很少（一般一个移动app至少也要20个页面），如果使用内部样式表进行开发的话，就会遇到一个非常头疼的问题：如果众多页面中有一些样式相同的地方，是不是都要在样式表中再写一遍？

事实上，根本不需要去这么做。最好的方法就是：在HTML文档的外部新建一个CSS样式表，然后把样式表引入HTML文档中。这样就可以实现同一个CSS样式可以被无数个HTML文挡调用。具体做法是：新建一些HTML文挡，在HTML文档外部新建一个以.css为后缀名的CSS样式表，在HTML文档的<head>部分以<link type="text/css" rel="stylesheet" href="url">标签进行引入。

这时会发现，外部样式表内的样式已经可以在HTML文档中进行使用了。这样做的话，需要对所有页面进行样式修改的时候，只需要修改一个CSS文件即可，而不用对所有的页面逐个进行修改。只修改CSS样式，就不需要对页面中的内容进行变动。