<pre>标签的基本样式设置

断行

在html中，换行符无法在一般标签内作为布局控制显示，包括xml实体 &#10; 和 &#13; 均表现为white-space，仅用于断字^【1】。

一般情形下，可使用<br>标签断行；但需要从原始xml文本读取内容时，处理实体转义要麻烦一些，此时可使用<pre>标签。

<pre>标签意为 preserve，保留内部文本的换行和空格^【2】。

样式

若在项目中使用了样式框架，则预定义样式可能不能满足<pre>标签的特殊需求。

此时可清除继承样式后，自行设置必要的样式，例如：

.pre_style{
  all:initial;             /*清除继承样式*/
  display:block;           /*设置布局流，避免换行导致的错误布局*/
  white-space:pre-line;    /*保留换行符，设置溢出换行*/
  font-size:12px;          /*设置字号*/
}

 

---

【1】https://stackoverflow.com/questions/3488198/why-is-br-an-html-element-rather-than-an-html-entity?noredirect=1 

【2】http://www.w3school.com.cn/tags/tag_pre.asp