Question

是否可以更改<span>代码（或<div>）以预先格式化其内容，例如<pre>代码仅使用CSS？

Answer 1

查看W3C CSS2.1 Default Style Sheet或CSS2.2 Working Draft。复制PRE的所有设置并将它们放入您自己的类中。

pre {
    display: block;
    unicode-bidi: embed;
    font-family: monospace;
    white-space: pre;
}

Answer 2

请参阅the white-space CSS property。

.like-pre { white-space: pre; }

Answer 3

这使得SPAN看起来像PRE：

span {
  white-space: pre;
  font-family: monospace;
  display: block;
}

请记住根据需要更改css选择器。

Answer 4

具体来说，您正在查看的属性是：

white-space: pre

http://www.quirksmode.org/css/whitespace.html
http://www.w3.org/TR/CSS21/text.html#white-space-prop

Answer 5

试试这个

span {
    white-space: pre;
    font-family: monospace;
    display: block;
    unicode-bidi: embed
}

Answer 6

为什么不使用＆lt; pre＆gt;标签，而不是span标签？两者都是内联的，因此两者都应该按照您希望的方式运行。如果您在覆盖＆lt; pre＆gt;的整个定义时遇到问题，请为其指定一个类/ ID。

Answer 7

试试这种风格

.pre {

white-space: pre-wrap;
white-space: -moz-pre-wrap;
white-space: -pre-wrap;
white-space: -o-pre-wrap;
word-wrap: break-word;
line-height: 1.5;   
word-break: break-all;
white-space: pre;
white-space: pre\9; /* IE7+ */
display: block;
}

在这里使用相同的内容 - http://www.makemyshop.in/

Answer 8

虽然接受的答案确实是正确的，但是如果您希望将文本换行，则应使用：

white-space: pre-wrap;

如何使用CSS将跨度更改为pre？

8 个答案: