使用Twitter Bootstrap，如何更改CSS样式以尊重换行符？

I am using Twitter Bootstrap which sets the CSS styles for the <pre> tag so that line breaks are not preserved. What property do I need to change to reset the default behaviour?

我正在使用Twitter Bootstrap设置

标签的CSS样式，以便不保留换行符。我需要更改哪些属性才能重置默认行为？

<pre>
line 1
line 2
line 3
</pre>

produces

产生

line 1 line 2 line 3

rather than

而不是

line 1
line 2
line 3

2 个解决方案

#1

Most probably your display:block; property is getting overridden. You need to set pre{display:block;} in your external stylesheets. twitter bootstrap version 2 has pre tag defined as display:block; by default, so it is obvious that you are overriding it.

很可能你的显示器：块;财产被覆盖。您需要在外部样式表中设置pre {display：block;}。 twitter bootstrap版本2的pre标签定义为display：block;默认情况下，很明显你要覆盖它。

#2

I would suggest using a different element tag and going with a javascript code syntax highlighting API. The browser will not allow you to change how the pre tag works. You can't change the shadow DOM for a pre tag. If you are looking for more flexibility with your code snippets I would go this route.

我建议使用不同的元素标记，并使用突出显示API的JavaScript代码语法。浏览器不允许您更改预标签的工作方式。您无法更改预标记的阴影DOM。如果您正在寻找代码片段的更多灵活性，我会选择这条路线。

http://www.w3schools.com/tags/tryit.asp?filename=tryhtml_pre

http://www.w3schools.com/tags/tryit.asp?filename=tryhtml_pre