html - 如何使用Pre标签限制HTML中的断字

我在设计中使用了

标签。事情是我的pre甚至在行尾打断了单词。假设我在行尾，如果有一个大字，那么它就会打断它。例如，在该行的末尾，我们有一个大字说STACKOVERFLOW。
因此，我的pre标签将单词STACKOVERFLOW显示为：

STAC
KOVERFLOW


应该在新行中显示整个单词的位置。
以下是我的pre标签代码：

pre{
        white-space: pre-wrap;
        word-wrap: break-word;
    }


以下是我的HTML代码：

<div uib-carousel active="active" class="text-primary">
  <div uib-slide index="$index" class="uibSlider" ng-repeat='summary in desc'>
<pre class="text-justify">{{summary.info}}</pre>
</div>
</div>
            
            
            最佳答案            
            
            
请参见w3 specification for the word-wrap property：


“断词”
如果行中没有其他可接受的断点，则不可中断的“单词”可以在任意点处中断。整形字符的形状仍然像单词未中断一样，并且字素簇必须一起保持为一个单元。在断点处没有插入连字符。

因为您使用的是“断字”规则，所以这意味着如果容器中没有剩余宽度并且没有其他更可接受​​的断点，则长字将被打断。

而是尝试使用“正常”规则：


'正常'
行只能在允许的断点处中断。但是，如果行中没有其他可接受的断点，则可以放宽“断字：保持全部”引入的限制以匹配“断字：正常”。
关于html - 如何使用Pre标签限制HTML中的断字，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/42283768/