Question

我在网页中有一个应用程序，我遇到了阻止内部文本转移的问题。我以前的表接受min-width选项，并在你增加网站页面时阻止文本/ td的拉伸/移动（例如我有双显示器，所以当我伸展超过2个显示器时，除了页脚之外一切都保持固定）。

我想知道如何在页面中修复每个<td>文字。

HTML：

<table cellpadding="0" cellspacing="0" border="1" width="100%" style="min-width:1400px">
    <tr bgcolor="silver">
        <td align="center" valign="middle" width="200"> <font face="Arial, Helvetica, sans-serif" size="2.5">
                Last Modified:&nbsp;</font>

        </td>
        <td align="left" width="400"><font face="Arial, Helvetica, sans-serif" size="2.5">
                 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;/ClassifiedAds/Index.aspx</font> <br/>
        <font face="Arial, Helvetica, sans-serif" size="1"> </font> 
        </td>
        <td align="left" valign="middle" width="300"><font face="Arial, Helvetica, sans-serif" size="2.5"></font> </td>
    </tr>

https://jsfiddle.net/avaz8sbh/

Answer 1

检查这个小提琴，我添加了一个没有宽度的空白td，因此在调整页面大小时其他列不会调整大小。

https://jsfiddle.net/afelixj/avaz8sbh/1/

或者您也可以避免width="300"来自第三个td，因此它只会在页面调整大小时保持增长，同时保持另外两个固定宽度。

Answer 2

使用％百分比代替px，不要溢出100％像

<td width="20%">
<td width="30%">
<td width="50%">

同时删除style="min-width:1400px"

现在你的桌子将使用100％的页面并适合它。

50 + 30 + 20 = 100

保持100％宽度表的文本固定

2 个答案: