css文字换行问题white-space:pre-line或者white-space:pre-wrap,解决word-wrap:break-word解决不了的
想让文字换行必须要写的那几个css样式就略过了。当一行文字是数字或字母时或者数字字母组合时会出现不换行局面,这时候加个word-wrap:break-word;就基本可以解决但是有种情况是它解决不了的。
这里是项目中遇到的问题,朋友们如果没遇见也没事加深印象即可:前台页面用户输入文字的时候没有换行没有空格,文字传给后台,但是这些文字再一次原样输出(pre标签)传到前台页面时就会出现不换行的局面。
简单的说就是<pre>标签文字无法用word-wrap:break-word换行的。示例如下:

结果:
方法:在样式里面加上white-space:pre-line或者white-space:pre-wrap就可以轻松解决

css文字换行问题white-space:pre-line或者white-space:pre-wrap,解决word-wrap:break-word解决不了的的更多相关文章
- A space or line break was encountered after the "@" character. Only valid identifiers, keywords, comments, "(" and "{" are valid at the start of a code block and they must occur immediately following
mvc 控制器调用分布视图出错,("A space or line break was encountered after the "@" character. Only ...
- sed高级用法:模式空间(pattern space)和保持空间(hold space)
摘自:https://blog.csdn.net/ITsenlin/article/details/21129405 sed高级用法:模式空间(pattern space)和保持空间(hold spa ...
- CSS 文字换行与不换行
1. 强制不换行 p{ white-space:nowrap; } 2. 自动换行 p{ word-wrap: break-word; word-break: normal; } 3. 强制英文单词断 ...
- css 文字换行控制
强制不换行 white-space:nowrap 强制不换行,并显示省略号 word-wrap: normal; text-overflow: ellipsis; white-space: nowra ...
- CSS文字换行详细解说
本文列举了兼容 IE 和 FF 地换行 CSS 推荐样式,详细介绍了word-wrap同word-break地区别.兼容 IE 和 FF 地换行 CSS 推荐样式: 最好地方式是 word-wrap: ...
- css 文字换行
换行word-wrap: break-word 新起一行对长单词进行断句word-break:break-all 本行对长单词进行断句 不换行,强制一行white-space:nowrap table ...
- CSS关于子元素设置了float属性后父元素高度为0的解释和解决方法
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/stri ...
- div+css总结—FF下div不设置高度背景颜色或外边框不能正常显示的解决方法(借鉴)
原地址:http://blog.sina.com.cn/s/blog_60b35e830100qwr2.html 在使用div+css进行网页布局时,如果外部div有背景颜色或者边框,而不设置其高度, ...
- delphi 修改代码补全的快捷键(由Ctrl+Space 改为 Ctrl + alt + Space)(通过修改OpenTool生效)
delphi 的IDE快捷键与输入法切换键中突,以往的解决方法是下载一个ImeTool修改 windows 系统的快捷键 在 xp win7 都好使,但在win 10经常是修改完后,重启又失效了. 本 ...
随机推荐
- DB-MySQL:MySQL 正则表达式
ylbtech-DB-MySQL:MySQL 正则表达式 1.返回顶部 1. MySQL 正则表达式 在前面的章节我们已经了解到MySQL可以通过 LIKE ...% 来进行模糊匹配. MySQL 同 ...
- LigerUI 单独调用插件使用注意项
LigerUI 再某些情况下只需要使用部分功能,并不需要调用 ligerui.all.js . 比喻: 我现在只想用ligerGrid功能 只需要调用 <link href="lige ...
- c/c++ 比较好的开源框架
作者:EZLippi链接:https://www.zhihu.com/question/19823234/answer/31632919来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转 ...
- struts2学习之基础笔记4
拦截器 1.自定义拦截器类,必须继承AbstractInterceptor类(抽象类) 重写public String intercept (ActionInvocation arg0) 2.在Str ...
- c# rc4算法,加密解密类
rc4算法,原理,以密匙生成256位的密匙流,然后以车轮式滚过源数据异或加密. /* * 由SharpDevelop创建. * 用户: YISH * 日期: 04/04/2015 * 时间: 03:0 ...
- markdown写作软件推荐
最近发现了一款不错的编辑器,而且是全平台支持的.与其它一些 markdown 编辑器最大的不一样是——所见即所得,不再是一边源文件一遍预览的方式了. 总的说来 Typora 很赞,推荐一波. 点此前往 ...
- Unity Android发布“Bundle Identifier has not been set up correctly”
原文:http://answers.unity3d.com/questions/162141/android-bundle-identifier-has-not-been-setup.html
- LayUI中实现上级下拉框动态加载下级下拉框js
js代码: var form = layui.form, layer = layui.layer; form.on("select(上级)", function(data){ va ...
- adb屏幕截屏
import subprocess #执行结果使用管道输出,对于参数是字符串,需要指定shell=Trueprocess = subprocess.Popen('adb shell screencap ...
- bootstrap fileinput控件 + django后台上传、回显简单使用
一.控件下载:https://github.com/kartik-v/bootstrap-fileinput/ 官网:http://plugins.krajee.com/file-input 需要引入 ...