我有两个 HTML 元素 - 一个是div另一个是table. 它们都有两个元素 - div hasp和 table has td。两人的风格相同。
代码:
.container {
display: flex;
flex-direction: row;
}
p, td {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}Run Code Online (Sandbox Code Playgroud)
<div class="container" style="width:100px; background-color: red">
<p width="50px">
Hello world
</p>
<p width="50px">
Hello world
</p>
</div>
<table style="background-color: green">
<tr width="100px">
<td width="50px">Hello World</td>
<td width="50px">Hello World</td>
</tr>
</table>Run Code Online (Sandbox Code Playgroud)
他们的父母有100px宽度。实际上,我希望它们在大小溢出时被截断。对于div,我得到了所需的输出,但在table,我没有得到相同的结果。为什么会发生这种情况?是因为table有不同的默认样式吗div?