首页 > 其他分享 >html table 美化-html如何用css美化表格

html table 美化-html如何用css美化表格

时间:2022-08-21 20:22:38浏览次数:81  
标签:collapse 表格 html css background table 美化

html用css美化表格的方法:首先创建一个HTML示例文件;然后在body中创建table表格;最后通过style标签给表格添加css样式即可。

代码

下面通过示例来看看。

/*表格样式*/
table {
	width: 90%;
	background: #ccc;
	margin: 10px auto;
	border-collapse: collapse;
	/*border-collapse:collapse合并内外边距
(去除表格单元格默认的2个像素内外边距*/
}
th,
td {
	height: 25px;
	line-height: 25px;
	text-align: center;
	border: 1px solid #ccc;
}
th {
	background: #eee;
	font-weight: normal;
}
tr {
	background: #fff;
}
tr:hover {
	background: #cc0;
}
td a {
	color: #06f;
	text-decoration: none;
}
td a:hover {
	color: #06f;
	text-decoration: underline;
}

效果:

标签:collapse,表格,html,css,background,table,美化
From: https://www.cnblogs.com/wdysblog/p/16610756.html

相关文章