pre自动换行

简介:

从word复制到html中的文本,用pre能够原汁原味的展示出来,但是会出现超过屏蔽界限的情况。
需要进行换行处理。

422101-20161105162222174-96392370.png

加上一句css

pre {
    white-space: pre-wrap;
    word-wrap: break-word;
}

422101-20161105162235455-869718208.png

没毛病~



本文转自TBHacker博客园博客,原文链接:http://www.cnblogs.com/jiqing9006/p/6033398.html如需转载请自行联系原作者

相关文章
|
27天前
|
前端开发
HTML中的pre标签表示空格或换行
HTML中的pre标签表示空格或换行
marven编译时:<pre>错误: 不允许使用自关闭元素</pre>
marven编译时:<pre>错误: 不允许使用自关闭元素</pre>
75 0
解决 Element-ui中 表格(Table)单元格内换行转义符不起作用的问题
解决 Element-ui中 表格(Table)单元格内换行转义符不起作用的问题
1479 0
解决 Element-ui中 表格(Table)单元格内换行转义符不起作用的问题
用white-space:nowrap;解决中文标签换行问题
在web2.0的概念中,标签是个时常出现的东西,可是在设计时中文不象英文那样在表现标签云时表现的那么好,主要是中文词组的成为标签后,有时会出现长标签在标签云中被断行的问题。这个主要是用display:inline-block;这个属性~,具体代码如下:
171 0
|
前端开发 JavaScript
css:white-space及文本回车换行符
css:white-space及文本回车换行符
324 0
css:white-space及文本回车换行符
|
前端开发 容器
单词太长导致自动换行,出现空白区域。——word-wrap和word-break
写在前面: 在写页面的时候,偶尔有时会遇到下图这两种情况,一种是单词过长时会溢出div,一种是直接换行,导致出现空白区域。这两个情景就需要word-wrap、word-break这两个属性出场来解决了。闲话不扯了,本文主要内容有:word-wrap和word-break属性介绍,使用方法,他们之间的区别,浏览器兼容性,demo链接。需要的朋友可以过来参考下,喜欢的可以点个赞,希望能对大家有所帮助。 应用场景:
706 0
单词太长导致自动换行,出现空白区域。——word-wrap和word-break
|
Shell Perl Linux
去掉Enter字符(\r)的几个方法
数据:test.txt: f1:f2:f3:0#1 Shell:   #!/bin/bash while read line do echo $line result1=$(echo $line|awk -F ':' '{print $4}' ) echo $re...
1266 0
|
Web App开发 前端开发
如何做到又能用pre,又能用自动换行?
在构建个人网站页面时,从CSDN博客抓取下来的博客内容中的标签中的回车换行丢了,导致在新页面中显示为长长的一行,这可怎么得了。 方法一: 后台代码执行内容替换,把文本中的换行符全部替换成标签: 方法二: 加上这段CSS,标签就不会撑破网站了pre{ white-space: pre-wra...
1226 0