CSS入门
CSS样式规则
在使用HTML时，需要遵从一定的规范，CSS亦是如此。要想熟练地使用CSS对网页进行"打扮"，首先需要了解CSS的样式规则，也就是最基础的语法格式。
基本格式如下：
选择器{
属性1:属性值1;
属性2:属性值2;
属性3:属性值3;
······
}
在基本格式中，选择器用于指定CSS样式作用的HTML对象，大括号内是对该对象设置的具体样式。属性和属性值以"键值对"的形式出现，属性是对指定的对象设置的样式属性，如字体大小、文本颜色等等。键值对之间用英文:连接，多个键值对之间用英文;进行区分。
引入CSS样式表
如果想用CSS来打扮我们的网页，就需要在HTML文档中引入CSS样式表。引入样式表的常用方法有三种：
行内式内嵌式链入式
行内式
行内式也成为内联样式，是通过标记的style属性来设置元素的样式，其基本语法格式如下：
<标记名 style="属性1:属性值1; 属性2:属性值2;·······">内容</标记名>
其中style是标记的属性，在HTML中任何标记都拥有style属性，它被用来设置行内式，其中属性和值的书写规范与CSS样式规则相同，行内式只对其所在的标记及嵌套在其中的子标记起作用。
如下简单实例所示：
···
<h2 style="font-size:20px;color:green;">
这个二级标题的字体大小为20像素，颜色为绿色。
</h2>
···
内嵌式
内嵌式是将CSS代码集中写在HTML文档的头部标记中，并且用<style>标记定义，其基本语法格式如下：
<head>
<style type="text/css">
选择器{
属性1:属性值1;
属性2:属性值2;
······
}
</style>
</head>
该语法中，<style>标记一般位于<head>标记中的<title>标记之后，其实也可以把它放在HTML文档的任何地方，但是由于浏览器是从上到下解析代码的，把CSS代码放在头部便于提前被下载和解析，以避免网页内容下载后没有样式修饰带来的尴尬。同时必须设置type的属性值为"text/css"，这样浏览器才知道<style>标记包含的是CSS代码，因为<style>标记还可以包含其他代码，如JavaScript代码。
链入式
链入式是将所有的样式放在一个或者多个以.css为扩展名的外部样式表文件中，通过<link />标记将外部样式表文件链接到HTML文档中，链接基本语法格式如下：
<head>
<link href="文件路径" type="text/css" rel="stylesheet" />
</head>
该语法中，<link />标记需要放在<head>头部标记中，并且必须指定<link />标记的三个属性，具体如下：
href：定义所链接外部样式表文件的URL，可以是相对路径，也可以是绝对路径。type：定义所链接文档的类型，在这里需要指定为"text/css"，表示链接的外部文件为CSS样式表。ref：定义当前文档与被链接文档之间的关系，在这里需要指定为"stylesheet"，表示被链接的文档是一个样式表文件。
一个简单的CSS外部样式表文件如下：
h2{
text-align:center;
}
p{
font-size:16px;
color:green;
text-decoration:underline;
}
CSS基础选择器
要想将CSS样式应用于特定的HTML元素，首先需要找到该目标元素。在CSS中，执行这一任务的样式规则部分被称为选择器。在CSS中的基础选择器有标记选择器、类选择器、id选择器、通配符选择器、标签指定式选择器、后代选择器和并集选择器，对它们具体的解释如下：
标记选择器
标记选择器是直接使用HTML标记名称作为选择器，它按照标记名称进行分类，为页面中某一类标记指定统一的CSS样式。其基本语法格式为：
标记名{
属性1:属性值1;
属性2:属性值2;
······
}
该语法中，所有的HTML标记名都可以作为标记选择器，如body、p、strong等等。用标记选择器指定的CSS样式对该页面中所有该类型的标记都生效。
例如：
p{
font-size:12px;
color:#FFF;
}
上述代码使得页面中的所有p标记段落字体大小为12像素，颜色为白色。
类选择器
类选择器使用"."(英文点号)进行标识，后面紧跟类名，其基本语法格式为：
.类名{
属性1:属性值1;
属性2:属性值2;
······
}
该语法中，类名即为HTML元素的class属性的值，大多数HTML元素都可以定义class属性。类选择器的优势是可以为元素对象定义单独或相同的样式。
例如：
.red{
color:red;
}
.green{
color:green;
}
.font20{
font-size:20px;
}
上述代码可以使得页面中所有class属性为red的标记设置其文本颜色为红色，class属性为green的标记设置其文本颜色为绿色，class属性为font22的标记设置其字体大小为20个像素。
id选择器
id选择器和类选择器相似，只不过是用#进行标识，其后紧跟id名，其基本语法格式如下：
#id名{
属性1:属性值1;
属性2:属性值2;
······
}
该语法中，id名即为HTML元素的id属性值。大多数HTML元素都可以定义id属性，元素的id属性是唯一的，只能对应于文档中的某一个具体的元素。
通配符选择器
通配符选择器用*号表示，它是所有选择器中作用范围最广的，能匹配页面中所有的元素。其基本语法格式为：
*{
属性1:属性值1;
属性2:属性值2;
······
}
例如下面的代码，使用通配符选择定义CSS样式，清除所有的HTML标记的默认边距：
*{
margin:0; /*定义外边距*/
padding:0; /*定义内边距*/
}
实际网页开发中不建议使用通配符选择器，因为它设置的样式对所有的HTML文档都生效，而不管标记是否需要该样式，这样反而降低了代码的执行速度。
标签指定式选择器
标签指定式选择器又称为交集选择器，由两个选择器构成，其中第一个为标记选择器，第二个为class选择器或id选择器，两个选择器之间不能有空格，如h3.special或p#one。
例如：
p.special{
color:red;
}
上述代码对标签为<p>并且class属性为special的文本生效。
后代选择器
后代选择器用来选择元素或元素组的后代，其写法就是把外层标记写在前面，内层标记写在后面，中间用空格分隔。当标记发生嵌套时，内层标记就成为外层标记的后代。
例如：
p strong{
color:red;
}
strong{
color:green;
}
对应的HTML文档如下：
······
<p>
goldsunC
<strong>
嵌套的内容
</strong>
</p>
<strong>
单独的内容
</strong>
······
如上代码，goldsunC的颜色为默认颜色，嵌套的内容颜色为红色，单独的内容颜色为绿色。
并集选择器
并集选择器是各个选择器通过逗号连接而成的，任何形式的选择器(如标记选择器、类选择器等)，都可以作为并集选择器的一部分。如果某些选择器定义的样式完全相同或部分相同，就可以利用并集选择器进行整合。
例如在页面中如果有一个h2标题、一个h3标题和一个段落，他们的字号和颜色相同。而段落的文本具有下划线效果，实现如下：
h2,h3,p{
color:red;
font-size:15px;
}
p{
text-decoration:underline;
}
使用并集选择器可以使得CSS代码更加简洁、直观。