如何用html和bootstrap保证屏幕宽度内自动换行

Question

我正在 Flask、Mongodb、HTML 和 Bootstrap 上制作一个 Web 应用程序。我的问题是表格列中的单词会从屏幕上消失，我需要滚动浏览器窗口才能阅读它们。

您能给我一个建议，我应该使用哪些引导类或附加 HTML 标签来使自动换行效果良好并且标签中的文本适合屏幕尺寸？

我的 HTML 页面：

<div class="container-fluid">
    <table class="table table-striped">
        <thead>
            <tr>
                <th scope="col">Field</th>
                <th scope="col">Value</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>ID</td>
                <td>{{page.page_id}}</td>
            </tr>
                <td>Description</td>
                <td><pre><p class="text-break">{{page.body}}</p></pre></td>
            </tr>
        </tbody>
    </table>
</div>

这就是它在浏览器（Firefox）中的样子：

我尝试使用不同的类，但没有任何帮助（ 预先感谢您！

Answer 1

删除预标记。

如果需要设置尺寸 尺码 或者 溢出