限制<pre>中的宽度大小

Question

我正在尝试制作一个pre来限制不超过表的宽度大小,尝试使用此标记:

<?php
echo "<pre style='max-width:1px;'>".$long_string."</pre>";
?>

无论是<pre>和表,但在任何情况下都不起作用.

有人可以帮帮我吗？

Answer 1

max-width在pre元素上设置实际上限制了它的宽度.您可以通过使用浏览器的开发人员工具检查元素,也可以通过在其上设置背景颜色来查看pre { background: yellow }.注意:使用outline属性测试它会在Firefox中产生错误的结果; 但即使它border正确地实现了属性.

与渲染元素一样,内容可能会溢出元素的宽度,默认情况下是可见的溢出.如果您希望将其剪掉,只渲染适合的部分,请设置pre { overflow: hidden }.如果您希望用省略号"..."表示截断,请同时设置pre { text-overflow: ellipsis; }.

如果您想在需要时将长行换行以使内容适合,您可以改为设置pre { white-space: pre-wrap }.但是,没有空格的长字符串仍然可能导致溢出.这可以通过添加pre { word-wrap: break-word; }(旧语法)或pre { overflow-wrap: break-word; }(新语法,稍微有限的浏览器支持)来防止.