如何在HTML中预标记文本？

Question

我想在我的HTML标记中的文本预先标记，它不工作。我在CSS下面使用我的标记。

我得到了下面的CSS从How do I wrap text in a pre tag?

pre { 
    white-space: -moz-pre-wrap; /* Mozilla, supported since 1999 */ 
    white-space: -pre-wrap; /* Opera */ 
    white-space: -o-pre-wrap; /* Opera */ 
    white-space: pre-wrap; /* CSS3 - Text module (Candidate Recommendation) http://www.w3.org/TR/css3-text/#white-space */ 
    word-wrap: break-word; /* IE 5.5+ */ 
    border-radius: 0 !important; 
} 

我已经在主要的div添加<div class="form-group col-lg-8">。我不知道这件事是否重要。

正如您在下图中看到的那样，它没有正确包装文本。 '哪个'被分成下一行'Whic'和'h'。

如何推动下一行的整个单词？

Answer 1

卸下word-wrap: break-word;

表示通常牢不可破字可以在任意点，如果不存在，否则在该行上可接受的断点被破坏。

https://developer.mozilla.org/en-US/docs/Web/CSS/word-wrap

Answer 2

它看起来像你的目标是使用等宽字体与文字一起，所以我会这样设置它：

div .pre { 
    word-wrap: normal; 
    font-family: monospace; 
    border-radius: 0 !important; 
} 

由于不使用任何<pre>标签保存你的格式，同时保持等宽字体。