css怎么给表格设置边框

文章2022-05-14134 人已阅来源：网络

css表格设置边框的方法：1、使用border属性给table元素添加边框，语法“table{border:宽度样式颜色;}”；2、使用border属性给td元素添加边框，语法“td{border:宽度样式颜色;}”。

css怎么给表格设置边框

本教程操作环境：windows7系统、CSS3&&HTML5版、Dell G3电脑。

默认表格是没有边框的

<table>
	<tr>
		<td>商品</td>
		<td>价格</td>
	</tr>
	<tr>
		<td>T恤</td>
		<td>￥100</td>
	</tr>
	<tr>
		<td>牛仔褂</td>
		<td>￥250</td>
	</tr>
	<tr>
		<td>牛仔库</td>
		<td>￥150</td>
	</tr>
</table>

css怎么给表格设置边框

我们可以通过css来给表格添加边框。

方法1：只对表格table标签设置边框

只对table标签设置border（边框）样式，将让此表格最外层table一个边框，而表格内部不产生边框样式。

语法：

table{
	border: 1px solid red;
}

效果图：

css怎么给表格设置边框

方法2：对td设置边框

对table表格td设置边框样式，表格对象内td将实现边框样式，但中间部分td会导致出现双边框。

语法：

td{
border: 1px solid red;
}

效果图：

css怎么给表格设置边框

如果觉得双线效果不好看。可以设置：

table {
        border-collapse: collapse;
        
}

为表格（table）设置合并边框模型（合并边框），效果图：

css怎么给表格设置边框

（学习视频分享：css视频教程）

以上就是css怎么给表格设置边框的详细内容！

相关内容

css设置表格某一行固定不动
css设置表格某一行固定不动的方法：1、使用css定位th，并根据父级滚动条scrolltop的偏移量获取值，然后用js把偏移量赋值到th的定位top上；2、使用jq插件设置表...
在css中设置边框可以用哪些属性
在css中设置边框可以用border属性、border-style属性、border-width属性、border-color属性等。边框属性允许我们指定一个元素边框的样式和颜...
css边框样式如何定义
css定义边框样式的方法：可以利用border-style属性来设置边框样式，如【p.dotted{border-style:dotted;}】，表示将边框设置为点状边框。本文...
css中怎么插入表格
css中插入表格的方法：使用【<style>】标签在文档头部定义内部样式表，代码为【<styletype="text/css">hr...
css如何设置边框
css设置边框的方法：1、在一个border简写属性设置边框；2、按照【border-width】、【border-style】、【border-color】属性顺序依次设置边...
css怎么设置边框为虚线样式
在css中，可以使用border-style属性来设置边框为虚线样式，只需要给元素添加“border-style:dashed;”样式即可。border-style属性用于设置...
css如何去除边框
css去除边框的方法：1、使用“border:none”定义无边框样式；2、使用“border:1pxsolidtransparent”设置边框透明；3、使用“border:1...
css怎么取消边框
在css中，可以通过给元素设置“border:none;”或“border:transparent;”样式来取消边框。border属性用于设置元素的边框样式，当值为“none”...
css如何隐藏表格
在css中，可以使用display属性隐藏表格，只需要给tr元素设置“display:none”样式即可。display属性用于定义建立布局时元素生成的显示框类型，当值为non...
css怎么设置边框内颜色
css中可使用background-color属性改变边框内颜色，只需要给input元素设置“background-color:颜色值”样式即可。background-colo...

浏览更多有关 css 表格边框的内容