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

使用CSS格式化Table样式

在网页里使用table的时候,样式一般比较难管理,因为table的有些样式与其它控件不太一样
1、table的分外边框,tr边框,td边框,它们之间都是有间距的
2、你可以指定它们之间的间距为0,但当你设置边框时,会发现边框是2px宽的,因为在table里,tr、td等元素是相邻的
所以想做一个好看的table样式可以参考以下的步骤:
1、table设置
 border-collapse:collapse; /*设置间距为0*/
 border: 1px solid #808080; /*设置table的最外层边框*/
2、tr设置
 /*设置tr的上边与下边样式*/
 border-top-width: 1px;
 border-bottom-width: 1px;
 border-top-style: solid;
 border-bottom-style: solid;
 border-top-color: #808080;
 border-bottom-color: #808080;
3、th,td设置
 /*设置th,td的左边与右边样式*/
 border-right-width: 1px;
 border-left-width: 1px;
 border-right-style: solid;
 border-left-style: solid;
 border-right-color: #808080;
 border-left-color: #808080;
4、.NoBorder类设置
/*设置不显示边框的样式*/
.NoBorder {
 border-top-style: none;
 border-right-style: none;
 border-bottom-style: none;
 border-left-style: none;
}
通过前3项就可以显示一个全边框的table,
如果你想去掉某行或某列的边框,将tr或td的class设置成.NoBorder就可以了
如果你想去掉table最外面的边框,将table的class设置成.NoBorder就可以了
非常方便,当然我这个方法不能解决所有设计需求,但它是目前比较规整、方便的方法,代码量也比较小,逻辑也简单
大家可以在这个基础上进一步扩展做出更多样的table


相关文档:

在脚本里定义CSS样式cssFloat与styleFloat的问题

在使用“float”时,因为“float”是javascript的一个保留字,所以就不能使用style.float,而改成了style.cssFloat(IE使用的是style.styleFloat);
 if (window.navigator.userAgent.indexOf("MSIE")>=1)
{
this.listDiv01.style.styleFloat = "left";
this.listDiv02.style.styleFl ......

html css 表格边框

<html>
<head>
<mce:style type = "text/css"><!--
table
{
border-collapse:collapse;
}
td
{
border:solid 1px black;
}

--></mce:style><style type = "text/css" mce_bogus="1">table
{
border-collapse:collapse;
}
td
......

CSS样式表设计的十条技巧


1.css 字体简写规则
  当使用css定义字体时你可能会这样做:
  font-size: 1em;
  line-height: 1.5em;
  font-weight: bold;
  font-style: italic;
  font-variant: small-caps;
  font-family: verdana,serif;
  
事实上你可以简写这些属性:
  font: 1em/1.5em bold italic small-caps ver ......

网页去色变黑白(CSS)

来自:http://www.51xflash.com/website/html/200905/01-8904.html
CSS代码: (插入到CSS文件的最顶端)
html { filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1); }
或者:
*{filter: Gray;}
HTML代码: (插入到页面HTML源码的<HEAD>和</HEAD>之间)
<style>html{filter:progid:DXIm ......
© 2009 ej38.com All Rights Reserved. 关于E健网联系我们 | 站点地图 | 赣ICP备09004571号