将元素显示为通过CSS预格式化的文本

有没有办法通过CSS来模拟pre元素的显示？

例如，我可以通过使用CSS规则保持这个div中的空白完好无损吗？

 <div class="preformatted"> Please procure the following items: - Soup - Jam - Hyphens - Cantaloupe </div> 

Answer 1

使用white-space: pre在pre元素中保留空白预格式化。 为了更进一步，还要添加font-family: monospace ，因为pre元素通常默认设置为等宽字体（例如，用于代码块）。

 .preformatted { font-family: monospace; white-space: pre; } 

 <div class="preformatted"> Please procure the following items: - Soup - Jam - Hyphens - Cantaloupe </div> 

Answer 2

 .preformatted { white-space: pre-wrap; } 

我认为“预包装”更好。 它可以帮助长期在线。

Answer 3

是：

 div.preformatted { white-space: pre; } 

参考：

• white-space 。

Answer 4

为了得到<pre>你可以使用;

 div.preformatted{ white-space: pre ; display: block; }