如何使 WebView 中的文本换行？答案

【问题标题】：How to make text in WebView wrap?如何使 WebView 中的文本换行？
【发布时间】：2018-06-08 17:07:59
【问题描述】：

我的应用程序使用WebView 来显示在程序使用期间动态生成的动态 HTML。

我试图确保 HTML 的内容全部显示在 WebView 中，而根本没有水平滚动（垂直很好）。我找到了许多关于如何使 WebView 随内容缩放的指南，但反之则不然。

这是用于生成 HTML 的代码：

html
                .append("<head><style>\n")
                .append("   body {\n")
                .append("       font-size: ").append(Settings.getFontSize()).append("px;\n")
                .append("       font-family: ").append(Settings.getFontName()).append(";\n")
                .append("   }\n")
                .append("</style></head><body>\n");

然后，在正文中，我加载了一些我无法在此处发布的专有文本。文本通常会超出WebView 的右侧：

* 我为混淆表示歉意；专有信息

无法增加 WebView 大小以进行补偿。如何正确设置样式以允许文本换行？

我已经尝试将body 的width 设置为100%，将word-wrap 设置为“正常”。

谢谢。

编辑我的问题与 Bootstrap 无关。如果需要引导程序来简单地将WebEngine 的内容拟合到WebView 中，那将是不可能的；还有其他解决方法吗？

【问题讨论】：

看起来您可能需要使用Bootstrap 或其他可以为您管理此问题的框架。只是猜测。
Bootstrap with JavaFX的可能重复
我无法想象这样的基本功能需要引入像 Bootstrap 这样的繁重框架。这绝对不是重复的，因为它与您链接到的问题没有任何共同之处...
链接的问题显示了如何在WebView 中使用Bootstrap。 Bootstrap 完全符合您的要求。
但称其为重复问题是不正确的。我不是在问如何在我的应用程序中使用 Bootstrap。 Bootstrap 可能是一个不错的解决方案，但它不是同一个问题。

标签： java css javafx webview

【解决方案1】：

我找到了简单的解决方案。 WebView 默认情况下已经具有此功能。问题在于我生成的 HTML；我在<pre> 标记中包装了有问题的文本，这迫使它被呈现为一个连续的文本行。

仍然存在 1 或 2 个字符溢出并导致水平滚动的问题，但我应该能够通过一些 CSS 填充来解决此问题。

【讨论】：

哈哈不用担心。我的问题中没有包含<pre>，所以这也无济于事。不过，感谢您的尝试！