您现在的位置是:网站首页> 编程资料编程资料
CSS去除表格的默认间距并且制作1px的细线表_CSS教程_CSS_网页制作_
2021-09-09
1036人已围观
简介 现在在所谓“div css”的风气下,很多人放弃了表格,其实应该让每个标签物尽其用,在表现数据的地方,我们还是应该使用table。但是,我们在建立table的时候,会发现它会具有一些默认的样式,比如单元格td之间会有间距,所以我们通常开头是这样写的: <t
现在在所谓“div css”的风气下,很多人放弃了表格,其实应该让每个标签物尽其用,在表现数据的地方,我们还是应该使用table。但是,我们在建立table的时候,会发现它会具有一些默认的样式,比如单元格td之间会有间距,所以我们通常开头是这样写的:

| test | test | test |
|---|---|---|
| test | test | test |
我们只要给这个table一个border-collapse:collapse的样式,就可以达到这个效果了。
.dir{ width:100%; border-left:#C8B9AE solid 1px;border-top:#C8B9AE solid 1px;border-collapse:collapse;}
.dir td{width:25%;border-right:#C8B9AE solid 1px;border-bottom:#C8B9AE solid 1px;background-color: #D7D1CB;padding:10px 10px 6px;vertical-align: top;}
这样,我们达到了所需要的效果,并且,上面的css样式还把表格table定义成了1px的细线表格。
在没有对table进行内部样式定义,而通过样式表,成功的去除td默认的间距,以及定义为1象素的细线表格。真正做到了结构与表现的分离。
相关内容
- DIV CSS制作的个性水平导航菜单实例_Div+CSS教程_CSS_网页制作_
- DIV CSS制作网页时易犯的错误总结_Div+CSS教程_CSS_网页制作_
- 巧用CSS滤镜制作绚丽图片播放效果_CSS教程_CSS_网页制作_
- PDF、ZIP、DOC链接的标注(CSS技巧)_CSS教程_CSS_网页制作_
- css里expression实现界面对象的批量控制_CSS教程_CSS_网页制作_
- CSS教程:盒模型(BOX Model)_CSS教程_CSS_网页制作_
- 无延迟翻滚的图形与CSS混合风格按钮_CSS教程_CSS_网页制作_
- CSS教程:CSS中的定位(position)_CSS教程_CSS_网页制作_
- CSS教程:li和ul标签用法举例_CSS教程_CSS_网页制作_
- 非常流行的所谓的气泡窗口_CSS教程_CSS_网页制作_
点击排行
本栏推荐
