日期:2014-05-17  浏览次数:20908 次

css背景色和table样式,一些参考
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312"utf-8" /> 
<title>坏狼安全网-漂亮CSS Tables</title> 
</head> 
<style type="text/css"> 
/* CSS Document */ 
 
body { 
font: normal 11px auto "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; 
color: #4f6b72; 
background: #E6EAE9; 
} 
 
a { 
color: #c75f3e; 
} 
 
#mytable { 
width: 700px; 
padding: 0; 
margin: 0; 
} 
 
caption { 
padding: 0 0 5px 0; 
width: 700px; 
font: italic 11px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; 
text-align: right; 
} 
 
th { 
font: bold 11px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; 
color: #4f6b72; 
border-right: 1px solid #C1DAD7; 
border-bottom: 1px solid #C1DAD7; 
border-top: 1px solid #C1DAD7; 
letter-spacing: 2px; 
text-transform: uppercase; 
text-align: left; 
padding: 6px 6px 6px 12px; 
background: #CAE8EA  no-repeat; 
} 
/*power by www.winshell.cn*/ 
th.nobg { 
border-top: 0; 
border-left: 0; 
border-right: 1px solid #C1DAD7; 
background: none; 
} 
 
td { 
border-right: 1px solid #C1DAD7; 
border-bottom: 1px solid #C1DAD7; 
background: #fff; 
font-size:11px; 
padding: 6px 6px 6px 12px; 
color: #4f6b72; 
} 
/*power by www.winshell.cn*/ 
 
td.alt { 
background: #F5FAFA; 
color: #797268; 
} 
 
th.spec { 
border-left: 1px solid #C1DAD7; 
border-top: 0; 
background: #fff no-repeat; 
font: bold 10px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; 
} 
 
th.specalt { 
border-left: 1px solid #C1DAD7; 
border-top: 0; 
background: #f5fafa no-repeat; 
font: bold 10px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; 
color: #797268; 
} 
/*---------for IE 5.x bug*/ 
html>body td{ font-size:11px;} 
body,td,th { 
font-family: 宋体, Arial; 
font-size: 12px; 
} 
</style> 
<body> 
<table id="mytable" cellspacing="0" summary="The technical specifications of the Apple 
 
PowerMac G5 series"> 
<caption> </caption> 
<tr> 
<th scope="col">姓名</th> 
<th scope="col">年龄</th> 
<th scope="col">电话</th> 
<th scope="col">居住地点</th> 
</tr> 
<tr> 
<td class="row">badwolf</td> 
<td class="row">100</td> 
<td class="row">010-110</td> 
<td class="row">中国北京</td> 
</tr> 
</table> 
 
</body> 
</html> 
 

?一些常用的好看的web背景色

<html> 
<head> 
<title>web2.0 color</title> 
<style type="text/css"> 
body{ 
margin:20px; 
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; 
font-size:12px; 
} 
.style1{ 
width: 800px; 
height: 100px; 
margin: 0px auto; 
margin-bottom:20px; 
border:1px solid #96C2F1; 
background-color: #EFF7FF 
} 
.style1 h5{ 
margin: 1px; 
background-color: #B2D3F5; 
height: 24px; 
} 
 
.style2{ 
width: 800px; 
height: 100px; 
margin: 0px auto; 
margin-bottom:20px; 
border:1px solid #9BDF70; 
background-color: #F0FBEB 
} 
.style2 h5{ 
margin: 1px; 
background-color: #C2ECA7; 
height: 24px; 
} 
 
.style3{ 
width: 800px; 
height: 100px; 
margin: 0px auto; 
margin-bottom:20px; 
border:1px solid #BBE1F1; 
background-color: #EEFAFF 
} 
 
.style4{ 
width: 800px; 
height: 100px; 
margin: 0px auto; 
margin-bottom:20px; 
border:1px solid #CCEFF5; 
background-color: #FAFCFD 
} 
 
.style5{ 
width: 800px; 
height: 100px; 
margin: 0px auto; 
margin-bottom:20px; 
border:1px solid #FFCC00; 
background-color: #FFFFF7 
} 
 
.style6{ 
width: 800px; 
height: 100px; 
margin: 0px auto; 
margin-bottom:20px; 
border:1px solid #92B0DD; 
background-color: #FFFFFf 
} 
.style6 h5{ 
margin: 1px; 
background-color: #E2EAF8; 
height: 24px; 
} 
 
.style7{ 
width: 800px; 
height: 100px; 
margin: 0px auto; 
margin-bottom:20px; 
border:1px solid #A9C9E2; 
background-color: #E8F5FE 
} 
 
.style8{ 
width: 800px; 
height: 100px; 
margin: 0px auto; 
margin-bottom:20px; 
border:1px solid #E3E197; 
backgro