body{/*body标签*/
background-color:white/*背景色white(白色,等同于 #fff)*/
font-size:12px/*字体大小*/
font-family:Arial, Helvetica, sans-serif/*字体*/
margin:0px/*外边距*/
padding:0px/*内边距*/
color:white/*标签文字色*/
}
ul,li{
margin:0px/*外边距*/
padding:0px/*内边距*/
}
li{
display:inline/*元素会被显示为内联元素,元素前后没有换行符*/
list-style:none/*列表无样式*/
list-style-position:outside
text-align:center/*内部居中处理*/
font-weight:bold/*粗体*/
float:left/*元素左浮动*/
}
a:link{/*link 链接通用*/
color:#336601/*元素颜色*/
text-decoration:none/*无下划线*/
float:left
width:100px/*宽度*/
padding:3px 5px 0px 5px/*内边距 padding:上 右 下 左,margin是一样的*/
}
a:visited{/*访问过的链接*/
color:#336601
text-decoration:none
float:left
padding:3px 5px 0px 5px
width:100px
}
a:hover{/*鼠标划过链接,类似于一个mousemove事件*/
color:white
float:left
padding:3px 3px 0px 20px
width:88px
text-decoration:none
background-color:#539D26/*背景色*/
}
a:active{/*活动中的链接 鼠标左键点击事件(左键未弹起) */
color:white
float:left
padding:3px 3px 0px 20px
width:88px
text-decoration:none
background-color:#BD06B4
}
#nav{/*标签id为nav*/
width:700px
height:30px
border-bottom:0px/*下边框*/
padding:0px 5px/*另外一种那个写法 只有两个属性值时->padding:上下 左右*/
position:absolute/*绝对位置*/
z-index:1/*z序*/
left: 198px/*左定位*/
top: 25px/*右定位*/
}
.list{/*类class=list*/
line-height:20px/*行高*/
text-align:left
padding:4px
font-weight:normal
}
.menu1{
width:120px
height:auto
margin:6px 4px 0px 0px
border:1px solid #9CDD75/*边框border:粗细 样式 颜色*/
background-color:#09C
color:#336601
padding:6px 0px 0px 0px
cursor:hand/*鼠标样式hand*/
overflow-y:hidden/*元素超过高度时hidden(隐藏)*/
/*下面2行的是滤镜 透明度*/
filter:Alpha(opacity=70)
-moz-opacity:0.7
}
.menu2{
width:120px
height:18px
margin:6px 4px 0px 0px
background-color:#F5F5F5
color:#999999
border:1px solid #EEE8DD
padding:6px 0px 0px 0px
overflow-y:hidden
cursor:hand
}
body {/*设置body整体样式*/background-color: #DCDCDC /*背景色*/
font-family: Arial, Helvetica, sans-serif/*字体*/
font-size: 12px/*字体大小*/
line-height: 24px/*文字行高*/
color: #336699/*字体颜色*/
}
td, th { /*设置所有表格中td th样式 以下属性同body一样解释*/
font-family: Arial, Helvetica, sans-serif
font-size: 12px
line-height: 24px
color: #333333
}
a { /*设置链接样式*/
color: #3366CC
text-decoration: none /*无下划线*/
}
form { /*表单样式*/
background-color: #CCCC99
}
.title { /*设置类名为title的元素样式 */
font-family: Arial, Helvetica, sans-serif
font-size: 24px
line-height: 30px
background-color: #006666
color: #DCDCDC
}
.subtitle {/*设置类名为subtitle的元素样式 */
font-family: Arial, Helvetica, sans-serif
font-size: 16px
line-height: 22px
font-weight: bold/*字体粗细*/
color: #006666
}
.header {/*设置类名为header的元素样式 */
font-family: Arial, Helvetica, sans-serif
font-size: 24px
background-color: #006666
color: #DCDCDC
}
.nav { /*设置类名为nav的元素样式 */
font-family: Arial, Helvetica, sans-serif
font-size: 14px
font-weight: bold
background-color: #CCCCCC
}
.navLink { /*设置类名为navLink的元素样式 */
font-family: Arial, Helvetica, sans-serif
font-size: 14px
font-weight: bold
background-color: #DEDECA
}
.sidebar { /*设置类名为sidebar的元素样式 */
font-family: Arial, Helvetica, sans-serif
font-size: 12px
line-height: 18px
padding: 3px /*内补白为3像素*/
background-color: #FFFFFF
}
.sidebarHeader { /*设置类名为sidebarHeader的元素样式 */
font-family: Arial, Helvetica, sans-serif
font-size: 16px
line-height: 24px
color: #FFFFFF
background-color: #339999
}
.sidebarFooter { /*设置类名为sidebarFooter的元素样式 */
font-family: Arial, Helvetica, sans-serif
font-size: 12px
line-height: 18px
background-color: #CCCCCC
}
.footer { /*设置类名为footer的元素样式 */
font-family: Arial, Helvetica, sans-serif
font-size: 14px
font-weight: bold
line-height: 22px
color: #333333
background-color: #CCCCCC
}
.legal { /*设置类名为legal的元素样式 */
font-family: Arial, Helvetica, sans-serif
font-size: 9px
color: #333333
}
.box1 { /*设置类名为box1的元素边框样式 */
border-color: #CCCCCC #333333 #333333 #CCCCCC /*边框的上 右 下 左依次对应的颜色*/
border-width: medium/*边框粗细*/
border-style: ridge/*边框风格*/
}
.promo { /*设置类名为promo的元素样式 */
font-family: "Times New Roman", Times, serif
color: #000033
}
.titlebar { /*设置类名为titlebar的元素样式 */
font-family: "Times New Roman", Times, serif
font-size: 9px
color: #FFFFFF
background-color: #336699
}
.dingbat { /*设置类名为dingbat的元素样式 */
font-family: Arial, Helvetica, sans-serif
background-color: #99CC99
color: #006666
font-weight: bolder
font-size: medium
}
a:hover { /*设置当鼠标移上时候的链接样式 */
text-decoration: underline
}
input.big { /*设置input元素中类名为big的样式 */
width: 100px /*宽*/
}
input.small { /*设置input元素中类名为small的样式 */
width: 50px
}
/* 设置 页面上所有 header 标签的:背景、高度、下外边距* url 中为图片地址
*/
header {
background:url(../images/bannar.jpg) no-repeat
height:300px
margin-bottom:5px
}
/* 设置 id 为 content 的元素的下边距为5px
*/
#content {
margin-bottom:5px
}
/* 设置 id 为 zuoce 的元素的:高度、宽度、向右浮动
*/
#zuoce {
height:600px
width:640px
float:right
}
/* 设置 id 为 youce 的元素的: 边框、盒子阴影、宽度
*/
#youce {
border:1px solid #abcdef /* 边框 1像素 实线 颜色为abcdef */
box-shadow:1px 1px 3px RGBA(0,0,0,.5) /* 投影 x方向偏移1像素 y方向偏移1像素 扩散3像素 颜色黑色 透明度0.5 */
width:235px
}
/* 设置页面所有 footer 标签的:高度、背景颜色、清除浮动
*/
footer {
height:30px
background:#88dddd
clear:both
}
/* 设置页面上所有 img 元素的外边距:上下0、左右各2像素
* margin 的规则:
* 后面1个值:四面外边距一样
* 后面两个值:先上下,后左右
* 后面三个值:上,左右,下
* 后面四个值:上,右,下,左
*/
img {
margin:0px 2px
}
/* 设置 id 为 youce 的盒子内部所有 h5 标签的:
* 外边距为0
* 内边距为0
* 背景图片,不重复
* 高度23,少了单位,应该是23px
* 文本居中对齐
* 行高23像素
* 底边 2像素 点线 颜色0099ff
*/
#youce h5 {
margin:0
padding:0px
background:url(../images/leftbg.jpg) no-repeat
height:23
text-align:center
line-height:23px
border-bottom:2px dotted #0099ff
}
/* 设置 id 为 youce 的盒子内部所有 p 标签的:
* 左内边距为 10像素
* 外边距为0
* 上内边距为 8像素
* 字体大小 12像素
* 行高 1.5
*/
#youce p {
padding-left:10px
margin:0px
padding-top:8px
font-size:12px
line-height:1.5
}
/* 设置 id 为 youce 的盒子内部的所有 div 标签内部的所有 ul 元素中的所有 li 标签的:
* 列表样式为none,即不显示列表前面的:点、数字、方块或其他合法形状等
*/
#youce div ul li {
list-style:none
}
/* 设置 id 为 youce 的盒子内部的所有 div 标签内部的所有 ul 元素中的所有 li 标签中的所有 a 连接的:
* 不使用下划线
* 文字颜色为 234178
* 字体大小 12像素
*/
#youce div ul li a {
text-decoration:none
color:#234187
font-size:12px
}
/* 设置 id 为 youce 的盒子内部的所有 div 标签内部的所有 ul 元素中的所有 li 标签的 before 伪元素的:
* 内容为图片,url 中为图片地址
* 右外边距为 3像素
*/
#youce div ul li:before {
content:url(../images/4.gif)
margin-right:3px
}
/* 设置 id 为 youce 的盒子内部的所有 div 标签内部的所有 ul 元素的:
* 四面内边距为 7像素
* 四面外边距为 7像素
*/
#youce div ul {
padding:7px
margin:7px
}
/* 设置 id 为 youce 的盒子内部的所有 div 标签内部的所有 ul 元素中的所有 li 标签中的所有 a 连接的鼠标移入样式:
* 文字颜色变为 f00
*/
#youce div ul li a:hover {
color:#f00
}
/* 设置 id 为 zuoce 的盒子内部的所有 div 标签内部的所有 h3 标签的:
* 文字颜色为 0f0
* 下边框为 1像素 点线 颜色为999
* 外边距为0
* 内边距为0
*/
#zuoce div h3 {
color:#0f0
border-bottom:1px dotted #999
margin:0
padding:0
}
/* 设置 id 为 zuoce 的盒子内部所有 div 标签的:
* 边框为 1像素 实线 颜色为ccc
*/
#zuoce div {
border:1px solid #ccc
}
/* 设置 id 为 zuoce 的盒子的:
* 文字颜色为 888
* 外边距0
* 内边距0
* 字体大小 12像素
* 文本右对齐
*/
.zuozhe {
color:#888
margin:0
padding:0
font-size:12px
text-align:right
}
/* 同时设置 class 为 zhenwen、zhengwen、dian 和 pinglun 的所有标签的:
* 字体大小为 12像素
* 首行缩进 2个文字
* 行高 1.5
*/
.zhenwen,
.zhengwen,
.dian,
.pinglun {
font-size:12px
text-indent:2em
line-height:1.5
}
/* 单独设置所有 class 为 pinglun 的标签的:
* 字体颜色为 ff6600
* 会在前面设置样式的基础上追加这项设置,如前面已设置,前面的设置会被覆盖
*/
.pinglun {
color:#ff6600
}
/* 设置页面所有 footer 标签的:
* 文本颜色为 004587
* 文本居中对齐
* 行高为 30像素
* 会合并前面的 footer 样式
*/
footer {
color:#004587
text-align:center
line-height:30px
}
兄弟,哥只能帮你到这里了,希望够详细,望采纳~~