您的位置：首页 > Web前端 > CSS

html 表格样式

2015-11-12 09:58 603 查看

<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>表格样式</title>

<style type="text/css">
.tablelist {
font-family: 微软雅黑,verdana,arial,sans-serif;
font-size:12px;
color:#333333;
border:solid 1px #999999;
border-collapse: collapse;
margin:auto;
}
.tablelist th {
background-color:#c3dde0;
padding: 8px;
border:solid 1px #a9c6c9;
}
.tablelist tr {
background-color:#d4e3e5;
}
.tablelist td {
padding: 8px;
border:solid 1px #a9c6c9;
}
</style>

</head>
<body>

<table class="tablelist">
<tr>
<th>Info Header 1</th><th>Info Header 2</th><th>Info Header 3</th>
</tr>
<tr onmouseover="this.style.backgroundColor='silver';" onmouseout="this.style.backgroundColor='#d4e3e5';">
<td>Item 1A</td><td>Item 1B</td><td>Item 1C</td>
</tr>
<tr onmouseover="this.style.backgroundColor='silver';" onmouseout="this.style.backgroundColor='#d4e3e5';">
<td>Item 2A</td><td>Item 2B</td><td>Item 2C</td>
</tr>
<tr onmouseover="this.style.backgroundColor='silver';" onmouseout="this.style.backgroundColor='#d4e3e5';">
<td>Item 3A</td><td>Item 3B</td><td>Item 3C</td>
</tr>
<tr onmouseover="this.style.backgroundColor='silver';" onmouseout="this.style.backgroundColor='#d4e3e5';">
<td>Item 4A</td><td>Item 4B</td><td>Item 4C</td>
</tr>
<tr onmouseover="this.style.backgroundColor='silver';" onmouseout="this.style.backgroundColor='#d4e3e5';">
<td>Item 5A</td><td>Item 5B</td><td>Item 5C</td>
</tr>
</table>

</body>
</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航