html设置table阴影
时间: 2024-04-09 20:24:53 浏览: 181
在HTML中设置表格阴影可以通过CSS样式来实现。你可以使用box-shadow属性来添加阴影效果。下面是一个示例代码:
```html
<!DOCTYPE html>
<html>
<head>
<style>
table {
border-collapse: collapse;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
}
th, td {
padding: 8px;
text-align: left;
border-bottom: 1px solid #ddd;
}
th {
background-color: #f2f2f2;
}
</style>
</head>
<body>
<table>
<tr>
<th>Header 1</th>
<th>Header 2</th>
<th>Header 3</th>
</tr>
<tr>
<td>Data 1</td>
<td>Data 2</td>
<td>Data 3</td>
</tr>
<tr>
<td>Data 4</td>
<td>Data 5</td>
<td>Data 6</td>
</tr>
</table>
</body>
</html>
```
在上面的代码中,我们使用了box-shadow属性来给表格添加阴影效果。box-shadow属性的值由四个参数组成,分别是水平偏移量、垂直偏移量、模糊半径和阴影颜色。你可以根据需要调整这些参数来达到你想要的阴影效果。
阅读全文
相关推荐
















