关于html中的<pre>标签

pre 元素可定义预格式化的文本。被包围在 pre 元素中的文本通常会保留空格和换行符。而文本也会呈现为等宽字体。

<pre> 标签的一个常见应用就是用来表示计算机的源代码。

做网页即时聊天时的文字输入框采用<pre>标签。

<div class="chat_online">
<!--输入框-->
<pre class="pre_message" contenteditable="true"  contenteditable-directive=""></pre>
<!--输入框结束-->
</div>
其中

<pre></pre>需要写在一起，如果中间留有空格或者换行等，会导致输入框的光标不在开始位置。

contenteditable="true"可以设置<pre></pre>标签可编辑。

<pre></pre>的样式：

.pre_message{
width: 100%;
height: 100%;
height: 6em;
overflow-y: auto;
overflow-x: hidden;
padding-left: 20px;
outline: none;
border: 0;
font-size: 14px;
white-space: pre-wrap;
word-break: normal;
background-color: #e0e0e0;

}
效果如图：