行内方式、内嵌方式、链接方式、导入方式
1 ）行内方式
直接对 HTML 标签适用 style=""，例如：
1.<p style="color:#F00; background:#CCC; font-size:12px;"></p>
虽然这种方法比较直接，在制作页面的时候需要为很多的标签设置 style 属性，所以会导致
HTML 页面不够纯净，文件体积过大，不利于搜索蜘蛛爬行，从而导致后期维护成本高。
2 ）内嵌方式
将 CSS 代码写在<head></head>之间，并且用<style></style>进行声
明，例如：
1.<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2.<html xmlns="http://www.w3.org/1999/xhtml">
3.<head>
4.<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
5.<title>无标题文档</title>
6.<style type="text/css">
7.<!--
8.#div1{width:64px; height:64px; float:left;}
9.#div1 img{width:64px; height:64px;}
10.-->
11.</style>
12.</head>
13.<body>
14.<div id="div1"><img
src="http://www.cssxuexi.cn/index/images/ico/2days.gif" /></div>
15.</body>
16.</html>
即使有公共 CSS 代码，但每个页面都要定义的，如果一个网站有很多页面，每个文件都会变大，后期维护也大，如果文件很少，CSS 代码也不多 ，
这种方式还是很不错的。
3 ）链接方式
链接方式是使用频率最高，最实用的方式，只需要在<head></head>之间加上
1.<link href="style.css" type="text/css" rel="stylesheet" />，就可以了，这种方式将 HTML 文件和 CSS 文件彻底分成两个或者多个文件，实现了页面框架 HTML 代码与美工 CSS 代码的完全分离，使得前期制作和后期维护都十分方便，并且如果要保持页面风格统一，只需要把这些公共的 CSS 文件单独保存成一个文件，其他的页面就可以分别调用自身的 CSS 文件，如果需要改变网站风格，只需要修改公共 CSS 文件就OK 了，相当的方便，这才是我们 xHTML+CSS 制作页面提倡的方式。
2.HTML 代码
1.<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2.<html xmlns="http://www.w3.org/1999/xhtml">
3.<head>
4.<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
5.<title>无标题文档</title>
6.<link href="style.css" type="text/css" rel="stylesheet" />
7.</head>
8.<body>
9.<div id="div1"><img
src="http://www.cssxuexi.cn/index/images/ico/2days.gif" /></div>
10.</body>
11.</html>
CSS 代码
1.#div1{width:64px; height:64px; float:left;}
2.#div1 img{width:64px; height:64px;}
4) 导入方式
导入样式和链接样式比较相似，采用 import 方式导入 CSS 样式表，在 HTML 初始化时，会被导入到 HTML 文件中，成为文件的一部分，类似第二种内嵌方式。不建议使用
第二：四种样式的优先级
四种样式的优先级别是(从高至低)： 行内样式、内嵌样式、链接样式、导入样式。
3万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
