怎样运用CSS中的border-collapse属性【html5教程】,border-collapse

CSS中的border-collapse属性是用来设置表格边框是不是兼并，它有三个值个中separate示意星散边框，collapse示意兼并边框，inherit 示意从父级那继续属性

在制造表格的时刻我们能够经由过程border-collapse 属性来使两个边框兼并为一个，使得边框结果越发雅观，本日将要引见怎样运用border-collapse 属性以及它的两个值的区分

【引荐课程：CSS教程】

border-collapse 属性的寄义：

border-collapse 属性是用来设置表格的边框是不是兼并成一个单一的边框，照样像在table中设置了border后边框单独离开显现

border-collapse 属性的值

separate

这个属性值代表的是边框会被离开，不会疏忽 border-spacing 和 empty-cells 属性，它是默许属性值

border-spacing：指的是相邻单元格的边框间的间隔，因而我们能够经由过程该属性来设置边框之间的间距

empty-cells：指的是是不是显现表格中的空单元格

注重：这两个属性都只能在星散边框中运用

table{
	font-size:16px;
	color:#333333;
	border-collapse: separate;
	border-spacing: 12px;
		}
	th{
	border:1px solid #444;
	padding:25px;

	}
	td{
	border:1px solid #444;
	padding: 15px;
	}

tr{
	background:rgb(207,238,252);
}
	</style>

结果图：

collapse

指的是将表格中的边框兼并为一个单一的边框，关于border-spacing 和 empty-cells 属性会自动疏忽

例：

<style>
		table{
	font-size:16px;
	color:#333333;
	border-collapse: collapse;
		}
	th{
	border:1px solid #444;
	padding:25px;

	}
	td{
	border:1px solid #444;
	padding: 15px;
	}

tr{
	background:rgb(207,238,252);
}
	</style>

结果图：