您好,我正在尝试使表格响应,我需要像表格行一样相互响应和堆叠
HTML
<html >
<head>
<meta name="viewport" content="width=device-width; initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="teststyles.css">
<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<!--[if lt IE 9]>
<script src="http://css3-mediaqueries-js.googlecode.com/svn/trunk/css3-mediaqueries.js"></script>
<![endif]-->
<link href="media-queries.css" rel="stylesheet" type="text/css">
</head>
<body>
<table>
<tr>
<td>
<p> Stuff </p>
</td>
<td >
<p> Stuff </p>
</td>
<td >
<p> Stuff </p>
</td>
</tr>
</table>
</body>
</html>
CSS
table{
width: 990px;
margin: 0 auto;
}
tr{
display:table;
width:100%;
}
td{
display:table-row;
background:#efefef;
}
所以我认为 table-row 使元素表现得像 table 行,但由于某种原因它不像一个元素那样堆叠。有什么想法或提示吗?
编辑:
当我在常规 html 上打开它时看起来像这样但是当我在 fiddle 上打开它时它很棒
最佳答案
您的 HTML 文件中需要一个文档类型。第一行应该是:
<!DOCTYPE html>
关于html - 如何让我的 <td> 表现得像 <tr>,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24517974/