在用编辑器保存的数据到数据库的时候经常是在我们的内容前后加一个P标签，但是出来之后是一行，有时候会超过边框的宽度，所以研究了如何折行,如下代码:

<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title></title>

    </head>

    <body>

        <div style="width:400px;background-color: #dcdcdc;height: auto;">

            111111111111111111111111111111111222222222222222222223333333333

        </div>

        <br>

        <br>

        <br>

        <div style="width:400px;background-color: #dcdcdc;height: auto; word-wrap:break-word; word-break:break-all;overflow: hidden;">

            111111111111111111111111111111111222222222222222222223333333333

        </div>

    </body>

</html>

效果:

解释:

overflow 属性规定当内容溢出元素框时发生的事情。

word-break:

word-wrap 属性允许长单词或 URL 地址换行到下一行。

CSS3设置内容超过一定长度后自动折行的更多相关文章

  1. Easyui datagrid 设置内容超过单元格宽度时自动换行显示

    datagrid 设置内容超过单元格宽度时自动换行显示 by:授客 QQ:1033553122 测试环境 jquery-easyui-1.5.3 问题描述 单元格内容超过单元格宽度不会自动化换行.如下 ...

  2. emacs自动折行设置

    - emacs自动折行     - 临时设置下 M-x `toggle-truncate-lines`    - init.el 中添加 `(toggle-truncate-lines 1)`

  3. UIlabel多行文字自动换行 （自动折行）

    UIView *footerView = [[UIView alloc]initWithFrame:CGRectMake(, , , )]; UILabel *label = [[UILabel al ...

  4. js和css实现内容超过边框，就自动省略，自动添加title

    在项目汇总,我们有这样的需求,如果内容多了,就自动省略,自动添加title 这个需要判断判断俩个值,一个是width(),一个是scrollWidth, 在div中,如果内容没有超过边框,这俩个值是一 ...

  5. 实现当UILable的内容超出其范围后自动滚动效果

    本文主要介绍 [当UILabel的内容超出其自身的宽度范围后,进行互动展示的效果],我们先来看一下Demo的效果图. 实际实现起来并不十分繁杂,在这里,为了开发的效率,我们使用了一个已经封装好的UIL ...

  6. Html内容超出标记宽度后自动隐藏

    我们在显示长文本时,往往需要去在C#端去截取字符,但这绝对不是一个好方面,因为我们的长文本往往都是代HTML标记的,你一个载不好,就会出现乱码问题(出现半个HTML标记),而比较好的作法就是通过CSS ...

  7. jqGrid 列内容超过一定长度省略表示

    jqgrid初始化方法中的,对应列添加formatter方法 colNames : [ "描述" ], colModel : [ { name : 'description', i ...

  8. freemarker数据格式化问题(即数值超过三位后自动添加逗号问题)

    实际数据:{value:1007, name:'通用设备'}, 浏览器回显数据: 得出: freemarker 当数据超过3位的时候,会自动用逗号截取 格式如:1,007 解决办法: 加?c,如:${ ...

  9. css 文本超出容器长度后自动省略的方法!

    我们在给用户显示文本内容的时候,往往需要避免文本内容超出容器宽度,防止换行溢出,小弟在网上找了下发现网上的实现仅仅只是实现了用 ...省略了的功能! 而并没有获取光标提示的功能,所有小弟就结合网上的代 ...

随机推荐

  1. Linux内核分析 计算机是如何工作的——by王玥

    1.冯诺依曼体系结构:也就是指存储程序计算机 硬件(存储程序计算机工作模式): 软件(程序员角度): 2.API:程序员与计算机的接口界面 ABI:程序与CPU的接口界面 3.X86的实现: 4.X8 ...

  2. Linux内核分析——第二章 从内核出发

    第二章 从内核出发 一.获取内核源码 1.Git是分布式的:下载和管理Linux内核源代码: 2.获取最新提交到版本树的一个副本 $ git clone git://git.kernel.org/pu ...

  3. NBPL团队总结

    我们团队钱多多记账软件项目从2017年12月号开始,历时两个周.这两个周,我们从头学起,学到了很多新的知识,对一些概念有了认知,关于团队协作,关于团队建设,关于Android开发.回顾前两周,我们一致 ...

  4. scrapy 爬虫怎么写入日志和保存信息

    写入日志: 首先我的爬虫 name= article scrapy crawl article -s LOG_FILE=wiki.log 输出为不同格式: scrapy crawl article - ...

  5. Java单元测试框架 JUnit

    Java单元测试框架 JUnit JUnit是一个Java语言的单元测试框架.它由Kent Beck和Erich Gamma建立,逐渐成为源于KentBeck的sUnit的xUnit家族中为最成功的一 ...

  6. Beta阶段冲刺-6

    一. 每日会议 1. 照片 2. 昨日完成工作 3. 今日完成工作 4. 工作中遇到的困难 杨晨露:各种问题,虽然都是开发上面的问题,但是都提出来就有点头大了. 戴志斌:对小程序公众号的开发不了解,因 ...

  7. [Delphi]实现使用TIdHttp控件向https地址Post请求[转]

    开篇:公司之前一直使用http协议进行交互(比如登录等功能),但是经常被爆安全性不高,所以准备改用https协议.百度了一下资料,其实使用IdHttp控件实现https交互的帖子并不少,鉴于这次成功实 ...

  8. C语言入门：06.基本运算

    一.算术运算 C语言一共有34种运算符,包括了常见的加减乘除运算 1. 加法运算+ 除了能做加法运算,还能表示正号:+5.+90 2.减法运算- 除了能做减法运算,还能表示符号:-10.-29 3. ...

  9. require.js text 插件使用

    相比于使用script构建DOM结构,使用HTML标签来构建html是一个很好的方式.然而, 并没有很好的方式可以在js文件中嵌入 HTML .最好的方式是使用 HTML字符串, 但这很难管理,尤其实 ...

  10. UML实践详细经典教程

    面向对象的问题的处理的关键是建模问题.建模可以把在复杂世界的许多重要的细节给抽象出.许多建模工具封装了UML(也就是Unified Modeling Language™),这篇课程的目的是展示出UML ...