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

Question

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

例如,我可以使用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.