我使用CSS,但为了快速测试,我只是使用内联样式。这是我试图实现的代码:
echo "<td style='height=10px; width=10px;'>";
它确保单元格的最大宽度是10px,但是高度溢出了文本,所以它变得非常大(高)。
我试图实现的是任何信息,在这个单元格超过30个字符,我想隐藏,这样你就看不到了。
(我知道30个字符超过10px,但我只是想看看它是否有效!)
您的语法错误:
错误的
echo "<td style='height=10px; width=10px;'>";
良好
echo "<td style='height:10px; width:10px;'>";
然而,这并不能解决问题。按照我阅读规范的方式,只有固定布局的表才允许在溢出时剪裁其内容(而不是调整大小以适应它)。
更好/更简单的方法是使用DIV
。
请参见此示例:http://jsfiddle.net/Aa4JL/
但是,如果数据是表格格式的,并且需要使用表,则可以通过将单元格的内容包装在DIV
中来实现相同的效果。
<table>
<tr>
<td><div style='height:10px; width:10px; overflow: hidden;'>This text is clipped.</div></td>
</tr>
</table>
请注意,如果您不关心基于高度的剪裁,则可以使用固定布局表与white-space: nowrap
和text-overflow: ellipsis
相结合来实现良好的椭圆效果。这不需要用DIV包装内容。请注意,省略号效果只适用于较新的浏览器(内容仍应在较旧的浏览器中剪裁)。
<table style="table-layout:fixed;width:50px;">
<tr>
<td style='width:50px; overflow: hidden; white-space:nowrap; text-overflow: ellipsis;'>Long string of text with nice ellipses effect.</td>
</tr>
</table>
这把小提琴拥有我刚才描述的所有技术:http://jsfiddle.net/Aa4JL/4/
您可以使用文本溢出。这是使用text-overflow:ellipsis
的一个示例。我在jsfiddle上创建了一个示例,只是复制了上面示例中的代码。
我认为你做不到。。html只定义单元格的基本大小,这意味着如果没有任何文本,单元格的大小是多少。如果你的文本比单元格大,它不会停止它。
一个更好的方法是使用php和substring()函数。。
让我知道它是否有帮助,或者你是否需要帮助
如果将td
内容包装在div
:中,则似乎可以工作
演示:http://jsfiddle.net/LUmNc/
html属性也应该用双引号定义,例如
echo "<td style='"height:10px; width:10px;'">";
<style type="text/css">
td {
overflow-x: hidden;
}
</style>