table边框,table边框线
html怎样设置table的边框
html设置table的边框的方法是使用border?属性实现。
说明：
border 属性规定表格单元周围是否显示边框。
值 "1" 指示应该显示边框，且表格不用于布局目的。
在 HTML5 中，border 属性仅用于指示表格是否用于布局目的，且只允许属性值 "" 或 "1"。
完整用法举例：
1、html中的table代码如下：
!DOCTYPE html
html
head
meta charset="utf-8"
titletable的边框/title
/head
body
table border="1"
tr
? thMonth/th
? thSavings/th
/tr
tr
? tdJanuary/td
? td$100/td
/tr
tr
? tdFebruary/td
? td$80/td
/tr
/table
/body
/html
2、运行后的效果：
HTML中正确设置表格table边框border的三种办法
html中如果设置table的border为1px，实际会产生双线，十分不美观，那么在HTML中如何正确设置表格table边框border呢？
第一种方法：
1、将table的属性设置为：BORDER=0 、cellspacing=1 ；
2、设置table的背景色为即你要设置的table的边框颜色；
3、设置所有td背景色为#ffffff白色；
第二种方法：
1、设置BORDER=0 ；
2、再通过CSS，给Table加上1px的border-top,border-left；
3、然后再设置所有的td的border-right,border-bottom；
第三种方法（推荐）：
1、设置table的CSS为{border-collapse:collapse;border-style: solid;border-width: 1px;}
注：border-collapse:collapse;
separate 默认值。边框会被分开。不会忽略 border-spacing 和 empty-cells 属性。
collapse 如果可能，边框会合并为一个单一的边框。会忽略 border-spacing 和 empty-cells 属性。
inherit 规定应该从父元素继承 border-collapse 属性的值。
2、再设置td的CSS为{border-style: solid;border-width: 1px;}
转自：
table表格边框--黑色
页面结构如下所示：
页面css
.GFtable1{clear: both;width: 86%;margin-left: 7%;margin-right: 7%;height: 3.32rem;margin-bottom: 0.2rem;color: #fff;}
.GFtable1 table{width: 100%;height: 100%;overflow: hidden;border-collapse: collapse;border: none;}
.GFtable1 tr{}
.GFtable1 th{font-size:0.24rem;color:#fff;text-align:center;}
.GFtable1 td{font-size:0.24rem;color:#fff;text-align:center;border: 1px solid #279ed0;}
.GFtable1 td:nth-child(1){text-align:right;width:0.6rem;}
.GFtable1 tr:nth-child(1){background-color:#1ba4dd;}
.GFtable1 tr:nth-child(2){background-color:#38b7ec;}
.GFtable1 tr:nth-child(3){background-color:#5ed0ff;}
.GFtable1 tr:nth-child(4){background-color:#38b7ec;}
.GFtable1 tr:nth-child(5){background-color:#5ed0ff;}
.GFtable table{width:100%;height:100%;border-color: #279ed0;}
.GFtable tr{}
.GFtable th{font-size:0.24rem;color:#fff;text-align:center;}
.GFtable td{font-size:0.24rem;color:#fff;text-align:center;}
.GFtable td:nth-child(1){text-align:right;width:0.6rem;}
.GFtable tr:nth-child(1){background-color:#1ba4dd;}
.GFtable tr:nth-child(2){background-color:#38b7ec;}
.GFtable tr:nth-child(3){background-color:#5ed0ff;}
.GFtable tr:nth-child(4){background-color:#38b7ec;}
.GFtable tr:nth-child(5){background-color:#5ed0ff;}
最终效果
怎么隐藏table所有边框
隐藏table所有边框有以下两种方式：
一、直接通过table的属性定义：
table?border="0"/table
如下，直接给通过table的border属性，将其设置为0即可。
二、通过css样式控制：
table?class="tablebox"
????trtd/td/tr
/table
style
????.tablebox{border:0;}
????.tablebox?td{border:0;}
/style
通过css控制其边框，这样的话一定要在td上也写上。因为css如果只写table的，那就只是整个table的大边框被去掉，内部单元格的必须单独设置td。