下面以table中td的内容超出为例说明:

首先:

td {

  display: block;

  }

然后:给td设置css样式:

1.  td {

  word-wrap: break-word;

  }

2. td {

  overflow-wrap: break-word;

  }

以上两种样式都可以

一、设置之前

td中的内容超出边框

二、设置之后

三、总结

两种写法的效果是相同的,略有不同在于:

因为word-wrap这个属性最初是由微软发明的,所以,所有的浏览器都支持这个属性。

尽管有所有的浏览器都支持,但W3C决定要用overflow-wrap替换word-wrap,我想可能是他们认为word-wrap用词不当。overflow-wrapword-wrap具有相同的属性值,但现在,word-wrap被当作overflow-wrap的备选写法。

虽然已经有不少的浏览器支持overflow-wrap这种写法,但看起来没必要使用overflow-wrap来让老的浏览器不支持。所有的浏览器都会继续支持word-wrap这种写法。

div中内容超出自动换行的更多相关文章

  1. div中内容无法自动换行问题

    .l-text{ padding:.3em .5em; width:67%; height: auto; /*height:1.3em;*/ border:.1em #2294C3 solid; bo ...

  2. CSS 之 div中文字超出时自动换行

          在开发中很容易遇到div中文字超出的问题,在此总结以下方法: 1. white-space :属性设置如何处理元素内的空白.这个属性声明建立布局过程中如何处理元素中的空白符.所有浏览器都支 ...

  3. css div中内容绝对居中(多行内容)

    div中的内容绝对居中(不适合IE6哦,IE6我已经不考虑了),直接看代码吧. <!DOCTYPE HTML> <html> <head> <title> ...

  4. 解决html表格中内容超出不强制换行和超出宽度自动隐藏并显示省略号

    在表格布局中经常会遇到因为表格内容长短的变化导致布局混乱的情况,这个时候我们可能会有为了布局稳定把单元格宽度写死的情况:但是我们设置了宽度却发现超出了宽度之后会自动变大,用css定义元素的overfl ...

  5. 设置div中文字超出时自动换行

    一.对于div强制换行1.(IE浏览器)white-space:normal; word-break:break-all;这里前者是遵循标准.#wrap{white-space:normal; wid ...

  6. div中p标签自动换行

    只需要设置div的width属性,p标签加上word-break:break-word属性就会自动换行 ----------------2016.7.1-------------------- 今天在 ...

  7. 清除div中内容

    $.ajax({            url: "SearchSN.aspx",            data: "SN=" + $("#txtS ...

  8. <td>内容超出自动换行

    td 内容自动换行 table表格td设置宽度后文字太多自动换行 设置table 的 style="table-layout:fixed;" 然后设置td的 style=" ...

  9. css中hover设置边框后div中内容后移解决方法

    <style> .demo{width:1200px;height:400px;background:#fff;} .demo:hover{border:1px solid #cecece ...

随机推荐

  1. 64_p2

    perl-Class-XSAccessor-1.19-10.fc26.x86_64.rpm 12-Feb-2017 15:12 48098 perl-Clipboard-0.13-16.fc26.no ...

  2. 前端内容转译html

    其他地方采集过来的可以转译下,试试这个:var returnReg = /\n/g; detail = detail.replace(returnReg,""); var reg  ...

  3. [写出来才有价值系列:node.js]node.js 01-介绍及安装

    对于Node.js在百度百科上是这样解释的: Node.js是一个Javascript运行环境(runtime).实际上它是对Google V8引擎进行了封装.V8引 擎执行Javascript的速度 ...

  4. ftp,nfs和samba的区别

    先从名字上进行理解: 1. FTP(文件传输协议) 2. NFS(网络文件系统) 3. samba 即smb(服务信息块)协议 1 其中FTP 是TCP/IP协议栈所提供的一种子协议,该子协议具体可以 ...

  5. 使用常见的网络命令查看当前网络状态——Mac OS X篇

    转载自:http://blog.csdn.net/zkh90644/article/details/50539948 操作系统拥有一套通用的实用程序来查明本地主机的有线或者无线链路状态和IP的连接情况 ...

  6. JSP、EL表达式、JSTL

    JSP 1.什么是jsp? Java Server Pages: java服务器端页面.可以理解为一个特殊的页面,其中既可以指定定义html标签,又可以定义java代码.其本质就是一个Servlet. ...

  7. 解决IDEA导入Myclipse项目的时候没有识别为Web项目的问题

    IDEA在导入一个MyEclipse新建的Web项目的时候,一般会正确检测这个项目是什么项目.不过有时候会出现各种问题. 1. 出现一些Jar包不存在的问题,一般是servlet-api这样的包不存在 ...

  8. HDU 1217 Arbitrage(Bellman-Ford判断负环+Floyd)

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1217 题目大意:问你是否可以通过转换货币从中获利 如下面这组样例: USDollar 0.5 Brit ...

  9. JAVA邻接矩阵实现拓扑排序

    由于一直不适用邻接表 ,现在先贴一段使用邻接矩阵实现图的拓扑排序以及判断有无回路的问题.自己做的图.将就看吧. package TopSort; import java.util.LinkedList ...

  10. go-互斥锁及原子函数

    用于解决并发函数的竞争状态问题... package main import ( "fmt" "runtime" "sync" " ...