本文章是给那些刚开始学习CSS的新手和那些急着建站却又不知道怎么写CSS的人看的，所以文章里面不会牵涉到一些理论性的东西，而且文章也很浅显，写下的内容都是我个人的一些结论和经验，但是如果你完全不懂HTML，我还是建议你放一本HTML在旁边做参考。如果有错误还请大虾们多多指正。
在这一篇中，我主要就是说一些CSS最基本的概念和写法，如果你已经了解，即可跳过。
一、什么是CSS
CSS的全称是Cascading Stylesheet，中文含义是层叠样式表，个人理解的CSS就是：因为HTML是一种标记语言，一个标记就有一个对应的样式，那么把HTML的各个标记所对应的样式都放在同一个地方进行定义而产生的表，就是CSS——样式表。如果你创建了CSS，那么之后要使用这些标记的时候就可以不要重复的写那么多样式了，因为在之前的CSS里面已经定义了。这样就可以少写很多代码，这应该就是CSS的优点吧。另外CSS文件的后缀名是.css，用记事本即可查看和更改。好的，接下来开始正题。
二、CSS的添加
知道了CSS是什么，我们就先来看看怎么样添加CSS，CSS的添加其实很简单，常用的有2种方法：
现在不知道选择符和样式属性是什么不要紧，接着往下看吧，因为这个不是这一节主要的内容，大概能会意就行，第三节中我会解释的。
方法一：
在<head></head>标记之间直接写入CSS代码，格式如下：
<style type=”text/css”>
选择符1 { 样式属性1 : 取值1; 样式属性2 : 取值2; ……}
选择符2 { 样式属性1 : 取值1; 样式属性2 : 取值2; ……}
……
</style>
如果你要想在现有的样式表中导入外部的样式表的话可以使用@import url，格式如下：
<style type=”text/css”>
@import url（样式表的地址）
选择符1 { 样式属性1 : 取值1; 样式属性2 : 取值2; ……}
选择符2 { 样式属性1 : 取值1; 样式属性2 : 取值2; ……}
……
</style>
@import url中接的地址可以是绝对地址也可以是相对地址，另外这个语句必须写在所有其他选择符的前面。
另外，老版本的浏览器是不能识别<style>标记的，所以会把CSS直接放在网页中而导致出错，解决方法就是使用HTML注释把CSS代码包起来，当然，一般来说也没有这种情况，所以不写也差不多，具体格式为：
<style type=”text/css”>
<!–
选择符1 { 样式属性1 : 取值1; 样式属性2 : 取值2; ……}
选择符2 { 样式属性1 : 取值1; 样式属性2 : 取值2; ……}
–>
</style>
<!–和–>就是注释标记。
方法二：
在<head></head>标记之间调用外部的CSS文件，格式如下：
<link rel=”stylesheet” type=”text/css” href=”样式表文件的地址”>
同样，这个地址也是既可以是内部地址，也可以是外部地址，在这里再次说明，CSS文件的后缀名是.css，在CSS文件中定义的CSS代码是不要加<style type=”text/css”></style>标记的，直接写中间的选择符和属性就行。
三、CSS的格式
在CSS中，定义语句的格式为：
选择符 {
样式属性1 : 取值1;
样式属性2 : 取值2;
……
}
选择符的作用其实就是选择一个HTML的标记，像body、p、img等等都可以是选择符，选择符body就相当于选择了<body>标记，选择符p就相当于选择了<p>标记，依次类推。然后选择符下面的{}中就是对HTML中这个标记所包含内容样式的定义。
现在我们来看一个CSS的样例：
body {
background:#636363;
font-size:12px;
font-family: Verdana, Arial;
color:#B8BEBC;
text-align:center;
line-height: 140%;
margin:0px;
padding:0px;
}
在这个样例中，选择符是body，那么其后{}中所有的样式就将应用于<body></body>标记之间的所有内容，同理，如果选择符是h1的话，那么其后{}中的所有样式就将应用于<h1></h1>标记之间。而background、font-size和color等等就是样式属性，而#636363、12px和#B8BEBC就是其所对应的取值。
现在大家肯定会有一个问题，如果我定义了body的样式，又定义了h1的样式，我在<body></body>中使用了<h1></h1>，那么在<h1></h1>中内容的样式应该是什么呢？
答案是这样的，因为CSS具有继承性，如果外层对一个属性有了定义，而内层没有，那么内层就会继承外层的样式，比如说，我写了这样的HTML：
<body>
<h1>测试</h1>
</body>
在这个HTML中<body>包含了<h1>，所以<body>为外层，<h1>为内层，而我定义了body的background为#636363，那么如果我没有定义h1的background的值，那么h1的background也是#636363，但是如果我在h1的CSS中也定义了background，那么h1的CSS就应该以h1中定义的为准。
现在大家应该知道一个基本的CSS语句是什么格式了，我们就来看看CSS的一些最常用的语句吧，一般知道了这些语句，写基本的CSS样式也就不成什么问题了，当然你也可以略过下面的内容，在网上搜一搜就可以了，我在这里也推荐一个看CSS语句的好网站：http://www.yesky.com/imagesnew/software/css/index.html，大家有什么语句不知道，进去找找就OK。
1.width和height
width是用来定义当前块的宽度的，height是用来定义当前块的高度的。语法为：
width: 宽度;
height: 高度;
比如：h3 { height: 100px;}
那么，<h3></h3>这个块的高度就有100px，但是里面的内容不一定是100px，他只代表边界的高度。
2. background:
这条语句是用来设置背景的，语法为：
background: 背景颜色 url（背景图片地址） 背景图片重复方式;
背景颜色就填写颜色代码，背景图片重复方式有3种：no-repeat——不重复，repeat-x——水平方向重复，repeat-y——垂直方向重复。如果你不要设置背景图片，那就不写url（背景图片地址）和背景图片重复方式即可。
比如：background: #404040 url(sidebar_border.gif) repeat-y;
那么它所对应的标记的背景颜色就应该是#404040，背景图片则使用sidebar_border.gif，并在垂直方向重复，直到填满标记所对应的整个区域为止。
比如：background: #404040;
那么这个你的背景颜色就为#404040，而没有背景图片。
3. border:
这条语句是用来设置边框的，具体的使用方法为：
border: 边框粗细 样式 颜色;
边框粗细的单位一般都是用的 px（像素），常用的样式有实线solid和虚线dotted，颜色还是写颜色代码。另外border是定义所有的边框，当然，你也可以使用border-left、border-right、border-top和border-bottom对左右上下的边框单独定义。
比如：border-bottom: 1px dotted #777777;
那么它所对应的标记的底部就会有一条1px粗的颜色为#777777的虚线。
4. color:
这条语句是用来设置字体颜色的，使用方法为：
color: 颜色代码;
5. font:
这条语句是用来设置字体的，因为整条语句写在一起很长，所以一般都把他拆开来使用：
font-size: 字体大小;
font-family: 字体;
font-weight: 字体粗细;
一般来说字体大小为12px，默认的字体粗细为400，如果你要加粗，可以使用900或者bolder。
比如：font-size:12px;
font-family: Verdana, Arial, Tahoma;
font-weight: bolder;
那么该字体就为Verdana，如果没有Verdana，就为Arial，依次类推，字体大小则为12px，并且字体加粗。
6. text-align:
这条语句是用来设置字体的对齐方式的，使用方法为：
text-align: 对齐方式;
其中left为左对齐，right为右对齐，center为居中。
7. margin:
这条语句是用来设置边距的，使用方法为：
margin: 上边距 右边距 下边距 左边距;
一般来说单位也是px，记这个边距顺序也很好记，就是从上开始逆时针的顺序，当然如果你不想记，也可以使用margin-left、margin-right、margin-top、margin-bottom来分别定义边距即可。
8. padding:
这条语句和margin十分的像，是用来设置边界填充的，使用方法为：
padding: 上填充范围 右填充范围 下填充范围 左填充范围;
和margin完全一样，单位一般也是px，顺序也是逆时针，也可以使用padding-left、padding-right、padding-top、padding-bottom来分别定义。不过需要注意的是，边距和填充的区别，一个区域与另外一个区域之间的距离叫做边距，而一个区域中的内容离该区域边界的距离叫填充。
关于颜色代码的获取，我上传了一个非常好的颜色代码获取软件，虽然这个软件要求你注册，但是这个注册是完全免费的，而且就算你不去注册，也完全不会影响到软件的功能和使用次数，最主要的还是这个软件小的好，用起来是十分方便，下载地址是：http://www.bigasp.com.cn/Uploads/Files/Program/Color_Select.rar，希望大家也还喜欢。
好吧，基础篇就讲到这里，基本上掌握这一些就可以实现一些简单的CSS样式了，不过这个实在是太简单了，在下一章完结篇中，我将说下怎么超快速的掌握用CSS+DIV和SPAN来设计网页，另外还十分的感谢大家能够耐心的开完这篇冗长的文章，这也是对我莫大的支持，谢谢。
