易截截图软件、单文件、免安装、纯绿色、仅160KB

CSS修饰的表格

下面这个CSS样式的表格,个人感觉颜色起到了很大的作用。如果不是两种颜色的对比效果好,可能也就是一般的表格:
先来看HTML:
<table width="590" cellspacing="1">
 <caption>
  text
 </caption>
 <thead>
<tr>
<th class="line1" scope="col">text</th>
<th scope="col">text</th>
<th scope="col">text</th>
<th class="line4" scope="col">More</th>
</tr>
</thead>
 <tbody>
<tr>
<th height="78">text text text text</th>
<td>text text text text</td>
<td>text text text</td>
<td class="line4"> </td>
</tr>
 </tbody>
 <tfoot>
<tr>
<th></th>
<td></td>
    <td></td>
    <td></td>
</tr>
</tfoot>
</table>
上面的表格没有什么要解释的,建议大家用thead,tbody,tfoot这些具有语义的标签。
body{
 background-color:#D5DFE9;
}
table{
 border-spacing:1px;
 border:1px solid #A2C0DA;
}
td, th{
 padding:2px 5px;
 border-collapse:collapse;
 text-align:left;
 font-weight:normal;
}
thead tr th{
 background:#B0D1FC;
 border:1px solid white;
 
}
thead tr th.line1{
 background:#D3E5FD;
}
thead tr th.line4{
 background:#C6C6C6;
}
tbody tr td{
 height:50px;
 background:#CBE2FB;
 border:1px solid white;
 vertical-align:top;
}
tbody tr td.line4{
 background:#D5D6D8;
}
tbody tr th{
 height:50px;
 background: #DFEDFF;
 border:1px solid white;
 vertical-align:top;
}
caption,tfoot{
 display:none;
}
#btn{
 text-align:center;
}
.txt{
 width:200px;
 height:20px;
}
上面的样式没有特别的地方。欢迎大家留言。


相关文档:

IE6不解析某些CSS代码的解决方法

网页采用了 UTF-8 编码格式,这本来没有问题,问题是外部 CSS 文件默认是 ANSI 编码,并没有保存为 UTF-8 格式。可能你会发现在一般情况下这样也是没有问题的,然而当 CSS 文件中包含有中文注释时就可能不尽如人意了!
  估计是 IE6 版本以下的浏览器在解析这个 CSS 文件时因为编码问题而无法正确解析,所以才会发生 CSS ......

css经典样式

一 CSS文字属性:
color : #999999; /*文字颜色*/
font-family : 宋体,sans-serif; /*文字字体*/ 
font-size : 9pt; /*文字大小*/ 
font-style:itelic; /*文字斜体*/ 
font-variant:small-caps; /*小字体*/ 
letter-spacing : 1pt; /*字间距离*/ 
line-height : 200%; /*设置行高*/  ......

CSS和JS标签style属性对照表


盒子标签和属性对照
CSS语法(不区分大小写)
JavaScript语法(区分大小写)
border
border
border-bottom
borderBottom
border-bottom-color
borderBottomColor
border-bottom-style
borderBottomStyle
border-bottom-width
borderBottomWidth
border-color
borderColor
border-left
borderLeft
border ......

25本经典CSS电子书


The CSS Anthology 101 Essential Tips Tricks Hacks 3rd Edition

The Ultimate CSS Reference

Teach Yourself Visually Html And CSS

Everything You Know About CSS is Wrong

The CSS Anthology 101 Essential T ......

用css让图片自动适应大小

图片自动适应大小的问题在平时制作的时候是比较常见的问题,下面提供一个比较简单的解决方法:
div img {
max-width:600px;
//IE7、FF等其他非IE浏览器下最大宽度为600px;
width:600px;
//所有浏览器中图片的大小为600px;
width:expression(document.body.clientWidth>600?"600px":"auto");
//当图片大小大于6 ......
© 2009 ej38.com All Rights Reserved. 关于E健网联系我们 | 站点地图 | 赣ICP备09004571号