CSS/Applying CSS to HTML and XHTML
CSS可使用链接、嵌入、内联方法用于HTML或XHTML。对于链接方法，CSS不是存储在HTML页中，而是存储在单独文件中。对于嵌入方法，CSS存放在HTML页面的header section中。对于内联方法，CSS存放在HTML tags的style属性中，例如<div style="font-weight:bold">Bold Font</div>.
最整洁的方法可能是链接，但其它两种方法在网页原型开发时更方便更快。内联方法避免考虑文档包含哪些CSS类。对于大型网站，很多网页共享相同的用户定制样式，链接方法是唯一可行的。
链接
[编辑]对于链接形式的CSS, CSS规则保存在单独的文件中。从HTML页引用该文件，增加link元素到head元素中。如下例假定使用文件"style.css"：
<head>
<title>Example Web Page</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
link元素有3个属性。第一个属性rel告诉浏览器链接目标的类型。第二个属性type告诉浏览器哪种样式表被使用。第三个属性href告诉浏览器到哪个URL去寻找样式表。本例中是相对的URL，也可用绝对URL。
在"style.css"包含如下单条规则：
p {
font-weight:bold;
}
这告诉浏览器段落(p)中的文本应该绘制为黑体。
绘制例子：
Text that will be formatted.
完整的HTML文档如下：
<!DOCTYPE html>
<html lang="en">
<head>
<title>Example Web Page</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<p>Text that will be formatted.</p>
</body>
</html>
嵌入
[编辑]嵌入CSS被放置于HTML文档的头部的样式（style）元素中。例如，希望HTML中的文字为黑体：
<!DOCTYPE html>
<html lang="en">
<head>
<title>Example Web Page</title>
</head>
<body>
<p>
Text that will be formatted.
</p>
</body>
</html>
在文档头部可放入CSS：
<head>
<title>Example Web Page</title>
<style type="text/css">
p {
font-weight:bold;
}
</style>
</head>
CSS被放入style元素中。该元素的属性type的值为text/css，告诉浏览器元素包含的样式表是CSS。如果属性type缺失或者设为不可识别值，CSS将不能用于页面。
例子中的这段CSS告诉浏览器把所有的段落(p)元素的内容显式为黑体。看起来这样：
Text that will be formatted.
嵌套了CSS的完整的页面文件：
<!DOCTYPE html">
<html lang="en">
<head>
<title>Example Web Page</title>
<style type="text/css">
p {
font-weight:bold;
color:green;
}
</style>
</head>
<body>
<p>
Text that will be formatted.
</p>
</body>
</html>
记住，可能的话，总是应该优先使用链接方法而不是嵌入的样式表。这使得可以轻易修改样式表而不必去跟踪不同的HTML文件中的样式信息。
内联
[编辑]内联CSS师在元素的开始标记（tag）的style属性中直接指出。例如：
<div style="font-weight:bold; color:red;">Bold Font</div>
将被绘制为：
注意，链接的CSS优于嵌入的CSS，而二者都优于内联的CSS。