易截截图软件、单文件、免安装、纯绿色、仅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 RESET

/* reset */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,p,blockquote,th,td{margin:0;padding:0;font-family:'宋体';}
div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,a,span {overflow:hidden;}
table{border-collapse:collapse;border-spacing:0; font-size:12px;}
td { line-height:18px ......

CSS强制不换行(white space:nowrap)IE使用问题

什么情况下会出现换行:
当元素设置了固定高度,并且文本长度大于标签元素的宽度时,文本会自动换行。
css强制换行使用样式:white-space:nowrap;该样式从效果上是没有浏览器差异,使用该样式后所有文字在ie和firefox下都在一行内显示。但是在IE下使用该属性值后标签元素宽度会被撑大,从而可能导致原来页面布局被破坏。 ......

Web开发 第二部分 CSS基础(一) CSS简介

CSS,层叠样式表的作用是什么?我们先通过一个例子来体会一下:
看代码:
index.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv=" ......

css:div属性详解


margin:层的边框以外留的空白
background-color:背景颜色
background-image:背景图片
padding:层的边框到层的内容之间的空白  
border:边框  
content:内容
 
步骤一、
分析一个典型的定义div例子:
 #sample{
margin:10px;
border: #111 10px solid;
......
© 2009 ej38.com All Rights Reserved. 关于E健网联系我们 | 站点地图 | 赣ICP备09004571号