◆简单的CSS◆
body { background-color:green;[网页背景色为绿]
color: red;[默认字颜色为红]
text-align: center;[文字居中，居左用left居右用right]
font-size:120%;或9px;[字体尺寸为默认的120%或小字体]
font-weight: bold[字体样式为粗体];
line-height: 18px[文字行距];
background-image: url(/down/20121124/44582/a.jpg)[我的磨图片的地址,上传后复制该图片下载地址,截取down后面部分即可]
width:340px;height:580px;[图片显示大小]
background-color:transparent[背景颜色透明];}
span {background-color:white[扩展名及“首页上页下页末页”一带背景色为白色];color:orange[位置同上，文字颜色]; border-style: groove; border-color:red[位置同上，文字外框架颜色]; border-width: 1px 1px[位置同上，文字外框架大小,第一个为横框架，第二个为竖框架，过大会导致外框架色完全覆盖该区域];}
a { border-style: solid;border-width:1px 1px[链接文字的外框架大小，第一个是横框架的，第二个是竖框架的];border-color: blue[同上位置，外框架颜色];color:gold[同上位置,文字颜色为金色];}
form{background-color:#000011[评论区域背景颜色];color:red[评论区域字体颜色];}
.file_list{color:brown[扩展名字体颜色,＊若前面已用了span部分修改将优先显示span部分];}
div {border-style: groove; border-color:#ff5566[上框条色]#446600[右框条色]#0033ff[下框条色]#1122ff[左框条色]; border-width: 4px 1px[框条粗细,第一个是横框架的，第二个是竖框架的];} [网页框架]
p {background-color:white[＂首页上页下页末页＂区域背景颜色];color:red[＂首页上页下页末页＂字体颜色];}
CSS颜色对照网址 http://www.rapidtables.com /web/color/Web_Safe.htm

◆复杂的CSS◆
本文由笑忘书网盘 13.02.23收集整理
http://35230.wodemo.com(转载请保留此信息)
【注意】：复制代码时注意带上该段的开头与结尾部分（如"body{" 和 "}"），删除【】部分、/* */部分、分割线以及换行，颜色代码（如red，#000000，#111）自行更换，说明仅供参考，因浏览器显示差异或属性覆盖等问题可能看不到效果，具体使用请自行摸索，欢迎各位提供纠正完善，更多属性代码参考请到 http://www.w3school.com.cn/css/，谢谢。
以下是通用代码，你可以利用它修改你想修改的区域的属性(如body{某通用代码} ，记得删除☆★等标识)
①字体属性
★font:
☆italic /*字体风格为斜体。normal:默认值，oblique:倾斜文字*/
☆bold /*字体浓淡为粗体。normal:默认值，bold:粗体，bolder:更粗，lighter:更细，100~900:
定义由粗到细的字符，400等同于 normal，而700等同于 bold*/
☆105% /*字体尺寸为默认的105%。通过百分比或12px等控制，由实际情况而定*/
☆small-caps /*字体为小型大写字母。若要正常值删除该部分即可*/
☆"Times New Roman",Georgia,Serif /*字体系列。通常字体系列名称有"serif"、"sans-serif"、"cursive"、"fantasy"、"monospace"。提示：建议使用多个，浏览器将使用其可识别的第一个值。使用逗号分割每个值，并始终提供一个通常字体系列作为最后的选择*/
;
②背景属性
★background:
☆url(背景图地址) /*加背景图*/
☆no-repeat /*背景图片重复属性。默认为图片既横向重复，又竖向重复，repeat-x:背景图片横向重复，repeat-y:背景图片竖向重复，no-repeat:背景图片不重复*/
☆scroll /*背景图随网页下拉而滚动*/
☆right /*背景图水平位置居右。left:居左，居中:center，也可以用1%-100%表示与左端距离大小*/
☆bottom /*背景图垂直位置位于底部。top:居顶部，center:居中，也可用1%-100%表示与顶端距离大小*/
☆#002255/*背景颜色*/
☆cover /*背景图尺寸。cover:保持原图宽高比例，缩放到正好完全覆盖定义区域 contain:保持原图宽高比例，缩放到宽度或高度正好适应指定区域，或用像素如320px 480px或百分比如80% 90%表示*/
;
③边框属性
★border:
☆5px /*边框宽度*/
☆solid /*边框样式*/
☆red /*边框颜色*/
;
添加文字下划线(即下边框)
★border-bottom:
同上(border部分)
;
边框宽度(可单独设置各框宽度)
★border-width:
☆2px 3px 0 5px /*分别为上右下左框*/
;
边框颜色(可单独设置各框颜色)
★border-color:
☆red white green #660022 /*分别为上右下左框*/
;
④内边距属性
★padding:
☆10px 5px 15px 20px /*分别为上右下左内边距*/
;
外边距属性
★margin:
☆10px 5px 15px 20px /*分别为上右下左外边距*/
;

⑤文本水平对齐属性
★text-align:
☆center /*文字居中。left:把文本排列到左边，默认值：由浏览器决定，right 把文本排列到右边，justify 实现两端对齐文本效果。*/
⑥圆角属性
★border-radius:
☆1px 1px 5px 5px /*分别为左上角，右上角，右下角，左下角*/
建议也加上下面两段，即复制上面那段在前面分别加上-moz-和-webkit-
★-moz-border-radius:1px 1px 5px 5px;
★-webkit-border-radius:1px 1px 5px 5px;
⑦阴影属性
★box-shadow:
☆inset /*阴影类型。默认为投影效果，inset:内阴影效果。*/
☆-2px /*阴影水平偏移值(即控制左右阴影。正数值控制左边，负数值控制右边)*/
☆2px/*垂直偏移值(即控制上下阴影。正数值控制上边，负数值控制下边)*/
☆10px /*模糊值*/
☆#06C /*阴影颜色*/;
建议也加上下面两段，即复制上面那段在前面分别加上-moz-和-webkit-
★-moz-box-shadow:inset -2px 2px 10px #06C;
★-webkit-box-shadow:inset -2px 2px 10px#06C;
⑧尺寸属性
height:102%/*元素的高度*/;
line-height:2px/*行高*/;
max-height:240px/*元素的最大高度*/;
max-width:320px/*元素的最大宽度*/;
min-height:100px/*元素的最小高度*/;
min-width:100px/*元素的最小宽度*/;
width:240px/*元素的宽度*/;
⊙伪元素
在某区域前面添加内容
★body【这里填要在其前面添加内容的区域】:before{content:
☆url(图片地址)
☆"要显示的文字"
;
}
在某区域后面添加内容
★body:after{
☆同上
}在某区域后面添加内容
★body:after{
☆同上
}
用于给文本的首行设置特殊样式
★.file_list【填要定义的区域】:first-line{
☆color等属性
}
以下是部分参考代码，恕不详细，其余请利用以上部分进行增添