链接外部样式文件：这种方式将样式文件与HTML文档分离，样式文件需要额外引入。一批样式可控制多份文档。
使用内部样式定义：这种方式是通过在HTML文档头定义样式单部分来实现的，每批CSS样式单只控制一份文档。
使用行内样式：这种方式将样式行内定义到具体的HTML元素，通常用于精确控制一个HTML元素的表现。每份css样式单只控制单个HTML元素
HTML文档使用link元素引入外部样式文件，引入外部样式文件应在head元素中增加如下link子元素：
type和rel表明该页面使用了CSS样式单，对于引入CSS样式单情形，这两个属性的值无需改变。href属性的值指向CSS样式单的地址，可以是相对地址也可以是网上的绝对地址。
Selector是应用样式的选择器，Selector决定对哪些HTML元素起作用，而花括号里的属性名、属性值则指定字体、大小、背景、颜色等。
内部css样式需要放在style元素中定义，每个css样式定义与外部css样式文件的内容完全相同。style应放在head元素内。
当定义一个css样式时需要指定Selector和属性定义两个部分。selector决定对哪些HTML元素起作用；属性定义，如{property：value}定义了对HTML元素起怎样的作用。当使用行内方式定义css样式时无需指定selector。
虽然div[id=xx]选择器定义的css样式并没有定义长宽，但该元素依然既有指定高度、宽度，这表明div元素的显示外观是多个css样式迭加作用的效果。
当多个css样式定义都可以对某个HTML元素起作用时，该HTML元素的显示外观将是多个css定义迭加作用的效果。如果样式定义有冲突，则冲突属性以优先级更高的css样式定义为准。
上面两个CSS样式都可作用于div元素，因此该div元素的显示效果是两个css代码样式迭加的效果。
包含选择器与子选择器有些类似，区别在于：对于包含选择器，只要目标选择器位于外部选择器对应的元素内部，即使是其孙子元素也可；对于子选择器要求目标选择器必须作为外部选择器对应元素的直接子元素才行。
兄弟选择器匹配与Selector1对应的元素后面、能匹配Selector2的兄弟节点。例如：
first-letter选择器仅对块元素（如div、p、section等元素）起作用。如果想对行内元素（如span等元素）使用该属性，必须先设定对象的height、width属性，或者设定position属性为absolute，或者设定display属性为block。通过该选择器配合font-size、float属性可制作首字下沉效果：
:first-line选择器同样同样只对块元素起作用，如果想对行内元素（如span等元素）使用该属性，必须先设定对象的height、width属性，或者设定position属性为absolute，或者设定display属性为block。
并不需要为所有元素的前后插入内容，只需要向部分元素的前后插入内容即可。可以在使用:before、:after伪元素选择器之前先使用更严格的CSS选择器。例如如下代码只在class属性为no的元素的尾端添加一张图片。
如果需要为多条内容添加编号，则可通过counter-increment属性定义计数器，然后提供countent属性引用计数器即可。
如使用非数字编号（比如使用罗马字母编号）。这种需求可以通过counter(name，list-style-type)用法实现，比如：
主要用于对已有选择器做进一步的限制，对已有选择器能匹配的元素做进一步的过滤。主要有以下三类：
上面:root选择器匹配的元素(HTML文档的根元素)指定了一个较浅的背景色，为body元素指定了一个较深的背景色。如果没有显式为文档根元素指定样式，那么body元素的样式会对整个文档起作用。
这组伪类选择器依次要求匹配该选择器的元素必须是其父元素的第一个子节点、最后一个子节点、第n个子节点、倒数第n个子节点、唯一的子节点。
required用于匹配有必填要求的HTML元素，optional用于匹配没有必填要求的html元素：
要求元素必须是命名锚点的目标，而且必须是当前正在访问的目标。页面可通过该选择器高亮显示正在被访问的目标。
如果需要在脚本中动态控制页面的显示效果，使用脚本动态设置css样式也十分简单，如下步骤可以动态修改目标元素的css样式：
脚本中的css属性名与页面中的静态css属性名并不完全相同。例如页面中的静态css属性名为color，脚本中的该属性名还是color；但如果静态css属性名为background-color，脚本中该属性的属性名为backgroundColor。脚本中的css属性名是去掉-，并将第一个单词首字母小写，后面单词首字母大写。
