想让文字换行必须要写的那几个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解决不了的的更多相关文章

  1. 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 ...

  2. sed高级用法:模式空间(pattern space)和保持空间(hold space)

    摘自:https://blog.csdn.net/ITsenlin/article/details/21129405 sed高级用法:模式空间(pattern space)和保持空间(hold spa ...

  3. CSS 文字换行与不换行

    1. 强制不换行 p{ white-space:nowrap; } 2. 自动换行 p{ word-wrap: break-word; word-break: normal; } 3. 强制英文单词断 ...

  4. css 文字换行控制

    强制不换行 white-space:nowrap 强制不换行,并显示省略号 word-wrap: normal; text-overflow: ellipsis; white-space: nowra ...

  5. CSS文字换行详细解说

    本文列举了兼容 IE 和 FF 地换行 CSS 推荐样式,详细介绍了word-wrap同word-break地区别.兼容 IE 和 FF 地换行 CSS 推荐样式: 最好地方式是 word-wrap: ...

  6. css 文字换行

    换行word-wrap: break-word 新起一行对长单词进行断句word-break:break-all 本行对长单词进行断句 不换行,强制一行white-space:nowrap table ...

  7. CSS关于子元素设置了float属性后父元素高度为0的解释和解决方法

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/stri ...

  8. div+css总结—FF下div不设置高度背景颜色或外边框不能正常显示的解决方法(借鉴)

    原地址:http://blog.sina.com.cn/s/blog_60b35e830100qwr2.html 在使用div+css进行网页布局时,如果外部div有背景颜色或者边框,而不设置其高度, ...

  9. delphi 修改代码补全的快捷键(由Ctrl+Space 改为 Ctrl + alt + Space)(通过修改OpenTool生效)

    delphi 的IDE快捷键与输入法切换键中突,以往的解决方法是下载一个ImeTool修改 windows 系统的快捷键 在 xp win7 都好使,但在win 10经常是修改完后,重启又失效了. 本 ...

随机推荐

  1. Java语言的优点

    1)Java为纯面向对象的语言. <Thinking in Java>提到Java语言是一种“Everything is object”的语言,它能够直接反应现实生活中的对象, 例如火车, ...

  2. 【转】解析<button>和<input type="button"> 的区别

    一.定义和用法 <button> 标签定义的是一个按钮. 在 button 元素内部,可以放置文本或图像.这是<button>与使用 input 元素创建的按钮的不同之处. 二 ...

  3. Core篇——初探Core的Http请求管道&&Middleware

    目录: 1.Core 处理HTTP请求流程 2.中间件(Middleware)&&处理流程 3.创建自定义中间件&&模拟Core的请求管道 Core 处理HTTP请求流 ...

  4. Bluefish Editor - 蓝鱼编辑器 for Web Designer

    Bluefish is a GTK+ HTML editor for the experienced web designer. Its features include nice wizards f ...

  5. Kattis - mixedfractions

    Mixed Fractions You are part of a team developing software to help students learn basic mathematics. ...

  6. Python-超好用的Django源码解析

    http://djangobook.py3k.cn/2.0/

  7. linux C++ 编译错误 file not found 其实是原文件后缀的问题

    gcc和clang会根据源文件的后缀.c或者.cpp判断原文件类型,采取不同的编译策略,所以我使用它们编译后缀是.c的C++原文件的时候会出现找不到include的文件的错误,使用正确的后缀名即可.同 ...

  8. vim配置C++开发环境 win10

    资料一 —— vim插件的安装 https://www.cnblogs.com/tianzhiyi/p/5338032.html 资料二 —— vim多窗口操作: https://blog.csdn. ...

  9. npx命令

    npx命令 查了一下, 英文资料: https://www.npmjs.com/package/npx 中文资料: 什么是npx 第一次看到npx命令是在 babel 的文档里 Note: If yo ...

  10. linux rar 解压忽略带密码压缩包

    #解压忽略密码 rar x -p- file.rar #解压忽略子目录 rar x -ep file.rar