CSS如何设置html table表格边框样式
2016-04-07 16:43
856 查看
对table设置css样式边框,分为几种情况:
1、只对table设置边框
2、对td设置边框
3、对table和td技巧性设置表格边框
4、对table和td设置背景,实现完美表格边框
table{border:1px solid #F00}
table td{border:1px solid #F00}
解决方法:对td只设置两个边的边框,对table也设置两个边的边框样式。
table{border-right:1px solid #F00;border-bottom:1px solid #F00}
table td{border-left:1px solid #F00;border-top:1px solid #F00}
1、只对table设置边框
2、对td设置边框
3、对table和td技巧性设置表格边框
4、对table和td设置背景,实现完美表格边框
一、只对表格table标签设置边框
只对table标签设置border(边框)样式,将让此表格最外层table一个边框,而表格内部不产生边框样式。table{border:1px solid #F00}
二、对td设置边框
对table表格td设置边框样式,表格对象内td将实现边框样式,但中间部分td会导致出现双边框。table td{border:1px solid #F00}
三、对table和td技巧性设置表格边框
如上第二点,只对表格对象td设置单一边框样式,中间部分td与td标签之间就会出现双边框现象。解决方法:对td只设置两个边的边框,对table也设置两个边的边框样式。
table{border-right:1px solid #F00;border-bottom:1px solid #F00}
table td{border-left:1px solid #F00;border-top:1px solid #F00}
相关文章推荐
- CSS3的基本介绍
- css3 localStorage 设计网页皮肤
- css样式控制div内容垂直居中
- HTML文档中嵌入CSS的三种常用方式
- 固定div,css固定
- 自定义Dialog样式+大小+位置
- CSS 制作三角形原理剖析
- css选择器总结
- 样式设置
- 通过原生js添加div和css
- Sass编译Css
- css Masks
- 前端学习笔记03,CSS
- 去除chrome浏览器自动添加的默认样式
- CSS制作图形变形弹出效果的示例分享
- 针对IE浏览器单独写CSS样式的几种方法
- 探究CSS box-shadow属性
- 浅谈CSS3 Filter的10种特效
- Css制作table细线表格
- 用CSS画网格线,在IE中