CSS意即Cascading Style Sheets。它是一种允许在HTML元素上添加效果的简单风格语言。每个元素类型以及这种类型的某个特定元素的每次出现都可以被声明为一种独特的风格，例如，边缘空白、位置、颜色、以及大小。你可以把这些风格单想象成模版，和桌面发布的应用程序模版很类似。举例来说，
body { background-color: white; color: darkblue;font-size:
margin-left: 10%}
连接和嵌入：
有多种方式把风格表单连接到HTML，每种方式都有各自的优缺点。为了和风格表单更好的结合，许多新的HTML元素和属性被引入到HTML文档
外部风格表单
一个外部风格表单可以通过文档HEAD中的<link>标签被任意多个HTML文档引用。标签的多个属性表明风格表单的相关特征——rel表明link的类型（一个风格表单）；type表明风格表单的类型（总是text/css）；href表明风格表单的位置。这是一种非常便利的方式，只要通过编辑一个文件就可以格式化整个网站以及改变整个网站风格。例如：
<HTML><HEAD>
<LINK rel="stylesheet" type="text/css" href="basic.css">
</HEAD>
<BODY> ... </BODY>
</HTML>
一旦你将风格表单连接到你的页面，你就需要创建风格表单。例如：
body {
color: darkblue; background-color: #ffeeff}
如果你把上面的例子保存为一个风格表单，每个连接到它的页面都将具有指定的风格。包含风格信息的文件一定要以扩展名css结束
嵌入风格表单
如果你有一个具有独特风格的单个文档，你可以使用嵌入风格表单。当然如果同一个风格表单可能在多个文档中用到，使用外部风格表单更合适。嵌入风格表单在HEAD中的STYLE元素中并将被应用到整个文档
<STYLE TYPE="text/css" MEDIA=screen>
<!--
body { background: url(flower.gif) lightyellow; color: darkblue }
.zn { margin-left: 8em; margin-right: 8em }
-->
</STYLE>
必需属性TYPE被用来指定媒体类型，这和它在LINK元素中的作用相同。应该把风格表单写成HTML注释的样式，在<!—和-->之间，以便在不支持css的浏览器中隐藏这些内容，否则它们将被显示出来
引入类型表单
你可以使用CSS的@import声明引入一个风格表单
<STYLE TYPE="text/css" MEDIA="screen, projection">
<!--
@import url(http://www.tongchiu.com/gen.css);
@import url(/product/file.css);
table { background: yellow; color: #003366 }
-->
</STYLE>
@import允许我们to keep some things the same while having others different;并且遵从这种语法：@import url(gen.css);
注意：如果有多个表单被引入他们将按引入的顺序层叠——最后引入的表单覆盖之前引入的表单，之前引入的表单又覆盖再前的表单，以此类推。如果引入的风格和主表单(link进来的表单或者STYLE中的表单)风格冲突，引入的表单将被覆盖。
内联风格
内联风格直接将风格应用于特定元素。任何开放标签都可以使用风格属性：
<P style="font-size:
要使用内联风格，我们要先通过Content-Style-TyleHTTP头扩展为整个文档声明一个单独的风格表单语言。使用内联CSS，一定要用text/css作为Content-Style-TyleHTTP头扩展或者在HEAD中包含下面的标签：
<META HTTP-EQUIV="Content-Style-Type" CONTENT="text/css">
语法：
基本语法如下：
selector { property: value }
这是一个属性（例如color），之后紧跟一个冒号：和一个值。一个属性(property)被赋给一个选择器（selector）以控制它的风格。property可以是color，margin和font等等。Value是属性可以接受的任何值。可以通过分号分割来为一个选择器声明多个风格。下面的示例未H1核P元素定义了color和font-size属性
<HEAD>
<TITLE>CSS Example</TITLE>
<STYLE TYPE="text/css">
H1 { font-size: x-large; color: darkred }
P { font-size:
</STYLE>
</HEAD>
你可以使用一组选择器和声明来减少风格表单中的重复声明。例如：
H1, H2, H3, H4 { color: #666666;"" align=left>Selectors
选择器用来使元素和风格声明相关联。这通过在块（包含在{}中的部分）中放置声明以及之前的选择器实现。例如：
p {color: #008000}
div {color: #cccccc; font-size:
标签选择器
你可以使用任何开放HTML标签来作为选择器
h3 {color: red}
类选择器
这允许你给元素指定一个特别的名字。例如：
<P class="zn"> .... </P>
在风格表单中，语法如下：
P.zn { color: blue }
或者这样
.zn { color: blue }
伪类可以被指定给一个元素来以不同方式显示连接，已访问连接以及活动连接。Anchor元素可以交给伪类连接，已访问连接或活动连接。已访问连接可以用不同的颜色甚至字体大小和风格来显示。示例如下：
A:link { color: red }
A:active { color: blue; font-size: 150% }
A:visited { color: green }
这种选择器很想类选择器，只有一点不同，就是只能通过给文档中元素一个特定ID来使用。ID选择器通过指示器”#”来赋值。例如：
#abc { text-style: bold }
要使用ID选择器：
<P ID=abc>Welcome to my website</P>
注意：ID选择器像类选择器，应该用小写字母，不能以数字开头或者包含空格。因为其内在限制，这种选择器类型应该保守使用
Span元素可以被用来作为风格表单的一个选择器，它也接受STYLE，CLASS和ID属性。示例如下：
<!DOCTYPE HTML PUBLIC "-//W
<HTML><HEAD><TITLE></TITLE>
<META HTTP-EQUIV="Content-Style-Type" CONTENT="text/css">
<STYLE TYPE="text/css">
<!--
.zn { font-size:
-->
</STYLE>
</HEAD>
<BODY>
<P><SPAN CLASS=zn>These words could be big.</SPAN></p>
<p><SPAN STYLE="font-family: Arial;font-size:12"> And these ones are different.</SPAN>.</P>
</BODY></HTML>
Div
DIV（division的简写）是一个块级别元素，功能上类似于SPAN。但DIV可以包含段落，标题和表。例如：
<DIV CLASS=zn>
<H1>Welcome</H1>
<P>Hello World</P>
<P>Welcome to my website!</P>
</DIV>
可以像如下方式声明color
P {color: red}
H2 { color: #000080 }
LI {color: rgb(12%, 51%, 62%)}
Background-color
设置元素的背景颜色，例如
BODY { background-color: white }
H1 { background-color: #000080 }
注意：
1、为了避免和用户风格表单的冲突，background-image应该无论在background-color是否被使用的时候都要指定。多数情况下background-image:none就可以了。
2、 如果背景颜色和BODY颜色不同，Netscape 4.*版本将不在背景块元素中填色——它不会在文字之间的空格填色。为了避免这个问题要显式地设置boder:none
Background-image
指定背景图片。例如：
BODY { background-image: url(/images/cloud.gif) }
P { background-image: url(http://www.internetcollege.com/bg1.gif) }
Background-repeat
声明背景图片的贴图。它的值可以是：repeat | repeat-x | repeat-y | no-repeat.
repeat-x值将使图片水平方向填充， repeat-y 值则在垂直方向填充。例如
BODY { background: white url(candybar.gif);
background-repeat: repeat-x }
上面的例子中图片将仅在水平方向进行贴图。IE中，repeat-x只是向右,repeat-y只是向下来画，而不是向左或者向上，虽然应该这样。
Background
Background允许一个或多个属性以order, image, repeat, attachment, position的顺序来指定。例如
BODY { background: white url(http://www.internetcollege.com/bg1.gif) }
BLOCKQUOTE { background: #6699ff }
P { background: url(image/line.gif) #e2e9ee fixed }
TABLE { background: #ffeeff url(house.gif) no-repeat top center }
Font-family
允许使用特定字体
P { font-family: Times }
可以指定多个字体，中间用逗号隔开。如果优先的字体不可用第二个将被选用。例如：Times，Arial.注意任何中间包含空格的字体名一定要加引号，单引号双引号都可以。例如：
P { font-family: "New Times Roman", Times, serif }
Font-size
字体大小以长度或者以下关键字：xx-small, x-small, small, medium (initial), large, x-large, xx-large来指定。例如：
H2 { font-size: large }
P { font-size:
LI { font-size: 80% }
Table { font-size: small}
Note: Internet Explorer 3 and Netscape 4.* treat all relative units and % as relative to the element default rather than as relative to the parent element.
注意：IE3和Nescape 4.*中，所有相对单位和%都是相对元素的默认值而不是相对于父元素
Font-style
定义字体的三种显示方式：normal, italic or oblique (slanted)。例如：
P {font-style: italic}
Font-weight
用来指定字体的weight（权重？），可以设置为normal或者bold。例如：
P {font-weight: bold}
It can also be specified as an absolute number, being one of 100, 200, 300, 400 (the same as normal), 500, 600, 700 (the same as bold), 800, or 900, where 100 is the lightest and 900 the most bold. For example:
或者可以指定为一个数字，100, 200, 300, 400 (和normal相同), 500, 600, 700 和bold相同), 800, or 900。100是最轻量的，900最粗。例如
H1 { font-weight: 800 }
Font
可以用来作为多种font属性的简写方式。例如：
P { font: italic bold
这用粗斜体的Times或者serif，尺寸为12points线长度14points的字体来指定一个段落
Text-align
可以设置为left，right，center或者justify（两边都调整）。Text-align只能应用到块元素并且被继承。例如：
H1 { text-align: center }
P.newspaper { text-align: justify }
Text-decoration
允许文本被装饰成五个属性之一：underline, overline, line-through, blink, 或者默认的 none.例如
A:link, A:visited, A:active { text-decoration: none }
Text-transform
允许文本转变为四个属性之一：none (默认), lowercase, uppercase, or capitalize (每个单词第一个字母大写).可以应用于所有元素并且被继承。例如
H1 { text-transform: uppercase }
H2 { text-transform: capitalize }
Margin通过指定长度或者百分比设置元素的边缘空白。每个元素可以有四个margin：left, right, bottom and top.通过margin-left, margin-right, margin-top, margin-bottom属性来定义。例如：
P {margin-left: 20px}
四个边缘可以用简写方式margin来同时指定，边缘可以为负值，默认为0
P {margin: 10px 12px
上边缘空白10pixel，右边缘空白12pixel，下边缘
Inheritance
基本上嵌套选择器将继承外层选择器的属性值。例如，BODY定义的字体也会被应用到段落中的文本。
! important
风格可以通过指定为!important设为重要风格。同等权重下重要风格将取代其他风格。重要风格声明如下：
BODY { background: url(man.gif) white; background-repeat: repeat-x ! important }
The weight sort
权重排序根据声明的权重来排列。声明的权重可以为正常或者重要。声明可以通过后缀!important(或者!important？r，一样的，搞什么)声明为重要的。例如：
P {font-size:
The order sort
当两个规则有相同的权重，最后指定的生效
P {color: red}
P {color: green}
绿色生效
Case sensitivity 所有CSS是大小写敏感的.
（英文原文）