box-shadow的问题

jiangl

76223110149

发布于
2016-10-12

给表格的某一行设置阴影效果，即对tr设置box-shadow无效？

css

阅读 10k

6 个回答

tr的默认display 为 table-row，你可以手动修改tr的display属性为inline-block就可以看到box-shadow生效了。

程序员阿杰

268113

发布于
2016-10-12

给tr设置display：block；就能设置阴影，但是效果极其难看~~

小小小菜鸟

6551210

发布于
2016-10-12

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style type="text/css">
tr{
display:block;
background:#fff;
-webkit-box-shadow:5px 2px 5px #00f;
-moz-box-shadow:2px 5px 5px #999;
}
</style>
</head>

<body>
<table width="200" border="0">
<tr>
<td>1</td>
<td>1</td>
<td>1</td>
</tr>
<tr>
<td>2</td>
<td>2</td>
<td>2</td>
</tr>
</table>
</body>
</html>