1.7 在HTML页面中使用CSS样式的4种方式
CSS样式能够很好地控制页面的显示，以达到分离网页内容和样式代码的目的。CSS样式可以用来改变从文本样式到页面布局的一切，并且能够与JavaScript结合以产生动态显示效果。在网页中应用CSS样式有4种方式：内联CSS样式、内部CSS样式、链接外部CSS样式表文件和导入外部CSS样式表文件。
1.7.1 内联CSS样式
内联CSS样式是所有CSS样式中比较简单和直观的方法，就是直接把CSS样式代码添加到HTML的标签中，即作为HTML标签的属性存在。通过这种方法可以很简单地对某个元素单独定义样式。
使用内联样式方法是直接在HTML标签中使用style属性，该属性的内容就是CSS的属性和值，其应用格式如下。
<p style="font-family:宋体; font-size:14px; color:#CCCCCC;">内联样式</p>
内联CSS样式由HTML文件中元素的style属性支持，只需要将CSS代码用分号“;”隔开输入在style=""中，便可以完成对当前标签的样式定义，是CSS样式定义的一种基本形式。
提示
内联CSS样式仅仅是HTML标签对于style属性的支持所产生的一种CSS样式表编写方式，并不符合表现与内容分离的设计模式，用内联CSS样式与表格布局从代码结构上来说完全相同，仅仅利用了CSS对于元素的精确控制优势，并没有很好的实现表现与内容的分离，所以这种书写方式应当尽量少用。
1.7.2 内部CSS样式
内部CSS样式就是将CSS样式代码添加到HTML页面的<head>与</head>标签之间，并且用<style>与</style>标签进行声明。这种写法虽然没有完全实现页头同内容与CSS样式表现的完全分离，但可以将内容与HTML代码分离在两个部分进行统一的管理。代码如下。
<html>
<head>
<title>内部样式表</title>
<style type="text/css">
body{
font-family: "宋体";
font-size: 12px;
color: #333333;
}
</style>
</head>
<body>
内部CSS样式
</body>
</html>
内部CSS样式是CSS样式的初级应用形式，它只针对当前页面有效，不能跨页面执行，因此达不到CSS代码多用的目的，在实际的大型网站开发中，很少会用到内部CSS样式。
提示
内部CSS样式中，所有的CSS代码都编写在<style>与</style>标签之间，方便了后期对页面的维护，相对于内联CSS样式的方式，页面大大瘦身了。但是如果一个网站拥有很多页面，当不同页面中的<p>标签都采用同样的CSS样式设置时，内部CSS样式的方法都显得有些烦琐了。该方法只适合为单一页面设置单独的CSS样式。
1.7.3 链接外部CSS样式表文件
外部CSS样式表文件是CSS样式中较为理想的一种形式。将CSS样式代码单独编写在一个独立文件之中，由网页进行调用，多个网页可以调用同一个外部CSS样式表文件，因此能够实现代码的最大化重用及网站文件的最优化配置。
链接外部CSS样式是指在外部定义CSS样式并形成以.css为扩展名的文件，在网页中通过<link>标签将外部的CSS样式文件链接到网页中，而且该语句必须放在页面的<head>与</head>标签之间，其语法格式如下。
<link rel="stylesheet" type="text/css" href="CSS样式表文件">
提示
rel属性指定链接到CSS样式，其值为stylesheet，type属性指定链接的文件类型为CSS样式表，href属性指定所定义链接的外部CSS样式文件的路径，可以使用相对路径和绝对路径。
提示
推荐使用链接外部CSS样式文件的方式在网页中应用CSS样式，其优势主要有：① 独立于HTML文件，便于修改；② 多个文件可以引用同一个CSS样式文件；③ CSS样式文件只需要下载一次，就可以在其他链接了该文件的页面内使用；④ 浏览器会先显示HTML内容，然后再根据CSS样式文件进行渲染，从而使访问者可以更快地看到内容。
1.7.4 导入外部CSS样式表文件
导入外部CSS样式表文件与链接外部CSS样式表文件基本相同，都是创建一个独立的CSS样式表文件，然后再引入到HTML文件中，只不过在语法和运作方式上有所区别。采用导入的CSS样式，在HTML文件初始化时会被导入到HTML文件内，成为文件的一部分，类似于内部CSS样式。链接CSS样式表是在HTML标签需要CSS样式风格时才以链接方式引入。
导入的外部CSS样式表文件是指在嵌入样式的<style>与</style>标签中，使用@import命令导入一个外部CSS样式表文件。
提示
导入外部CSS样式表与链接外部CSS样式表相比，其最大的优点是可以一次导入多个外部CSS样式文件。导入外部CSS样式表文件相当于将CSS样式表文件导入到内部CSS样式中，这种方式更有优势。导入外部CSS样式表文件必须在内部CSS样式开始部分，即其他内部CSS样式代码之前。