css的各类型及使用简介
/*
css其实很简单，不像c语言什么的有逻辑，基本是一个描述性的东西，也就是告诉你什么东西是什么样子的。
格式是
样式名称 {属性名:值;属性名:值;属性名:值;}
样式名称 可以是html内定元素比方说 a， body， td， tr （简而言之就是不带任何前缀的）
或者是自定义的 class 比方说 .nav , .clear , .layout （简而言之是带.前缀的）
或者是自定义的 id 比方说 #leftbody ， #right （简而言之就是带#前缀的）
id和class的不同就是 id唯一，class不唯一，同一个名字的'id 在页面上只能应用一次，class可以在多个地方应用，你要为你页面上唯一的一个元素写样式就可以用id，你希望你的这个样式在多个地方可以使用就使用class 。
下面的元素相同的我就解释一次，其他的你自己补充起来。
再给你一个css在线手册，不懂的可以查一查
*/
body,form,p,ul,li,img,h5{margin:0;padding:0;border:none}
/* body,form,p,ul,li,img,h5标签样式为 mrigin:0(外边距0)；padding:0(内边距0)；border:none(无边框)*/
body{color:#333;font-size:14px;line-height:24px;background:#2E8B57;}
/*body标签样式 color#333(文字颜色为#333);font-size:14px(文字大小为14像素 px就是pixel的简写 就是像素的意思，下面出现的所有px的单位都是 像素的意思)；line-height:24px(文字行高24像素)；
background:#2E8B57(背景颜色为#2E8B57)*/
a{color:#333;text-decoration:none}
/*text-decoration:none(文字下划线)*/
a:hover{background:#00FF7F;color:#000;}
/*a：hover(a标签鼠标悬浮的时候应用的样式)*/
.clear{clear:both;}
/*.clear(class为 clear的元素样式，clear:both(清除所有浮动))*/
div,td{table-layout:fixed;word-break:break-all;}
/*table-layout:fixed(表格单元格布局：固定布局)；word-break:break-all(文本换行：允许任意文字间换行-这是一个ie的专有属性，并不是标准css属性)。 前面 div，td 表示 有div和td2个元素应用后面的样式，中间用逗号隔开。*/
.Layout{width:990px;background:#FFF;margin:0 auto;overflow:hidden; padding:0 5px;padding-top:5px;}
/*名为Layout的class样式 width：990px(宽度为990像素)；overflow：hidden(超出范围隐藏)；
padding-top:5px(顶内边距5像素)
这里写了2次padding 一次是 padding：0 5px ，这是一种简写方式 是 padding：0px 5px 0px 5px 的简写
意思是 顶边距0px 右边距5px 底边距0px 左边距5px，顺序刚好是顺时针的一个圈，如果顶和滴 左和右的边距相同可以 简写到一起，就是 padding：0px 5px，0后面可以不带单位，
但是非0数字都必须带单位，这一点是css和html不同的地方。
之后又写了一个padding-top：5px 顶内边距5像素，
css 的优先顺序是 后面的属性覆盖前面相同的属性， 这2句话写一起实际就是 padding：5px 5px 5px 0*/
#LeftBody{width:200px;border-top:1px solid #99FF99;float:left;display:inline;overflow:hidden;}
/*float：left（向左浮动）；display:inline(布局方式：行布局)*/
#LeftBody .Content{border:1px solid #99FF99; border-top:none; padding:8px;}
/*#LeftBody .Content 这样的写法表示 在所有id为#LeftBody的元素内的class名为Content的元素。2个名称中间用空格隔开，前后顺序表示包含关系，前面的包含后面的。
border:1px solid #99FF99表示 边框为 1像素 实线 颜色为#99FF99
border-top是顶边框 border-bottom是底边框 同理 -left是左边的，-right是右边的 其他类似的属性也相似*/
#LeftBody #Logo{ padding:0; text-align:center}
/*text-align:center（文本对齐：居中对齐）*/
#LeftBody #Calendar{text-align:center}
/*#LeftBody #Calendar（id名为#LeftBody的标签中间的id名为#Calendar标签）*/
#LeftBody .Content .Header{ font-weight:bold;padding:0 5px;}
/*font-weight:bold（文字加粗）*/
#LeftBody .Content .Bodyer{ letter-spacing:1px; padding:0 5px;line-height:25px;}
/*letter-spacing：1px（字符间距1像素）*/
#LeftBody #AdHeader{background:#B9E089; padding:0; border-bottom:none; text-align:center;}
#LeftBody #AdBodyer{padding:0; border:none;}
#LeftBody #AdBodyer table{border:1px solid #99FF99; border-bottom:none; border-right:none}
#LeftBody #AdBodyer table td{ text-align:center; padding:4px;border:1px solid #99FF99; border-top:none; border-left:none}
#RightBody{width:782px;margin-left:8px;float:left;display:inline;overflow:hidden;}
/*width:782px;(宽度782像素)margin-left:8px;（外左边距8像素）*/
#RightBody #HeaderButton{width:172px;border:1px solid #99FF99; line-height:20px; font-size:12px; text-align:center;}
#RightBody .Header{margin-top:5px;border:2px solid #99FF99; border-bottom-width:1px;}
/*border-bottom-width:1px;（底边框厚度1像素）*/
#RightBody .Header a{display:block;border-right:2px solid #99FF99;border-bottom:none; text-align:center;}
#RightBody .Header a.Selected{ background:#B9E089;font-weight:bold;}
#RightBody .BiaoGe{border:1px solid #99FF99; border-bottom:none; border-right:none}
#RightBody .BiaoGe td{border:1px solid #99FF99; border-top:none; border-left:none; padding:3px;}
#RightBody .BiaoGe .beijing{ background:#B9E089; text-align:center; padding:2px; font-weight:bold;font-size:14px;}
有问题可以加我qq
【css的各类型及使用简介】相关文章：
1.第一章CSS简介
3.短语类型及练习
4.立秋的简介及习俗