下面以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. USB各种模式 解释

    1.MTP: 通过MTP这种技术,可以把音乐传到手机里.有了U盘功能为什么还要多此一举呢?因为版权问题,MTP可以把权限文件从电脑上导过去:如果只使用手机的U盘功能,把歌的文件拷过去之后,没有权限文件 ...

  2. python操作adb代码

    adb命令的练习 #!/usr/bin/env python # encoding: utf-8 import os import re nameplt=re.compile("packag ...

  3. Android 开发笔记(二)菜单设计

    菜单设计一 // 创建菜单 public boolean onCreateOptionsMenu(Menu menu) { menu.add(0, 0, 0, "关于"); men ...

  4. 【会装】kylin的安装(填坑)和简单使用

     1.简介 kylin的设计思想是空间换时间,将hive上的大表的维度全部排列组合计算也将度量提前计算然后存入HBase库,这个步骤在kylin中称之为build cube. 在查询的时候已经建立cu ...

  5. HDU 4614 Vases and Flowers(线段树+记录区间始末点或乱搞)

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=4614 题目大意:有n个空花瓶,有两种操作: 操作①:给出两个数字A,B,表示从第A个花瓶开始插花,插B ...

  6. 【DEV C++】 Error: ld returned 1 exit status

    一般出现“ld returned 1 exit status”错误都是由于函数名称拼写错误造成的,或者在一个工程中不同的函数使用了同一个函数名,暂时还未遇到其他情况.

  7. [实战]MVC5+EF6+MySql企业网盘实战(5)——登录界面,头像等比例压缩

    写在前面 关于该项目,已经很久没更新了.实在是找不到一个好的ui,没办法就在网上找了一个还不错的,就凑合着先用着吧,先出第一版,以后的再想着去优化.最近更新与网盘项目相关的内容是准备在项目中使用一个美 ...

  8. jquery自定义插件-参数化配置多级菜单导航栏插件

    1 自定义菜单导航栏插件的必要性 看图说话,下面是利用自定义的菜单导航栏插件simpleMenu创建的网站导航示例: 插件默认提供的是如上图的导航栏样式,即一二级菜单为横向分布:三四级菜单为纵向分布. ...

  9. Firefox 火狐 页面特殊符号乱码解决方法

    这是由于字体问题导致的. 解决方法,参照下图设置,重点是红色标注区域.衬线字体务必选择兼容性最好的,比如思源黑体.宋体.

  10. css3实现立方体,并且自转效果

    先是HTML 一个父div包含四个绝对定位的div <div class='container container--realistic'> <div class='cube cub ...