对于有很多条目的数据，通常采用table元素来快速实现,某一个td的内容太多的话就会导致样式混乱难看.

解决方案

要让table的宽度固定可以给table元素设置table-layout:fixed;样式，

但这样表格的宽度问题是解决了，但是里面的内容并不会自动换行。还需要给td设置word-break: break-all; word-wrap:break-word;。

table表格某一td内容太多导致样式混乱的解决方案的更多相关文章

  1. table表格宽带研究（附带：table表格为什么设置td宽度无效）

    情况1:下面代码定义了表格宽带为为600px,未设置td宽带,3个td内容为1,2,3,可以看到3个内容平分table的宽度. 也就是每个td都是200px(请注意:如果用chrome调试宽度,会有一 ...

  2. html 让table表格中的td单元格内容过长显示为固定长度，多余部分用省略号代替?

    <th class="wrap">商品名</th> .wrap{ width: 150px; //设置需要固定的宽度 white-space: nowrap ...

  3. table表单中的td内容两端对齐

  4. node_modules内容太大导致webstrom非常卡

    选中一个文件夹,例如node_modules,点击右键->mark directory as ->excluded,这样就可以把这个文件标记并排除出来,使webstorm不会扫描这个文件下 ...

  5. 关于table表格 td里内容较多换行的处理方法

    最近在用table的时候由于td内容较多默认换行了,很不美观.于是找到处理方法: 在声明table的时候添加一个样式: <table id="tbOffice" data-r ...

  6. html table表格列数太多添加横向滚动条

    HTML的table表格的列数如果太多或者某一列的内容太长,就会导致表格td的内容被挤压变形,对后台的使用体验非常不友好.比如下面的情况: 那么如何在表格列数较多的情况下添加横向滚动条?其实很简单,只 ...

  7. table表格宽度固定，同时td内容过长也不会被撑开

    table表格宽度固定,同时td内容过长也不会被撑开,设置如下css: table{table-layout:fixed;word-break:break-all;}

  8. 双击Table表格td变成text修改内容

    //先不多说这里上我的页面 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> ...

  9. table:设置边距,td内容过长用省略号代替

    table:设置边距,td内容过长用省略号代替 1.table:设置边距 合并表格边框border-collapse: collapse,然后用th,td的padding设置内容和边框之间的空隙pad ...

随机推荐

  1. [Unity2D]精灵动画

    通常我们在游戏里面创建的精灵比如玩家主角,它在移动的过程中一般会带有一些动画的效果,比如两只脚前后地移动,那么这种动画效果的实现和控制就可以通过Unity2D的动画系统来实现. 要添加这样的动画,首先 ...

  2. 字符串&数组的相互转换

    字符串 -> 数组 方法一: $str = "abcd" $s2 = $str.GetEnumerator()  #$s2是无法使用下标的方式进行索引的,因为其不是array ...

  3. MySql之触发器【过度变量 new old】

    trigger是由事件触发某个操作.这些事件包括insert语句.update语句和delete语句.当数据库执行这些事件时,就会激活触发器执行相应的操作. [1]只有一个执行语句 create tr ...

  4. sqlserver ldf过大处理方法

    第一步 DUMP TRANSACTION   databasename  WITH   NO_LOG  -- 第二步:截断事务日志  BACKUP LOG   databasename   WITH  ...

  5. Yii2 验证码不显示

    siteController 中,要将captcha 列为任意用户可以访问

  6. ul li横向排列及圆点处理

    如何用CSS制作横向菜单 让ul li横向排列及圆点处理   第一步:建立一个无序列表 我们先建立一个无序列表,来建立菜单的结构.代码是:<ul> <li><a href ...

  7. Ubuntu 卸载 VMware

    sudo vmware-installer --uninstall-product vmware-workstationsudo vmware-installer --uninstall-produc ...

  8. 使用无限生命期Session的方法

    使用无限生命期Session的方法 ［来源］ 达内    ［编辑］ 达内   ［时间］2013-03-28 Session储存在服务器端,根据客户端提供的SessionID来得到这个用户的文件,然后读 ...

  9. 微信公众账号开发教程（四）自定义菜单（含实例源码）——转自http://www.cnblogs.com/yank/p/3418194.html

    微信公众账号开发教程(四)自定义菜单 请尊重作者版权,如需转载,请标明出处. 应大家强烈要求,将自定义菜单功能课程提前. 一.概述: 如果只有输入框,可能太简单,感觉像命令行.自定义菜单,给我们提供了 ...

  10. 九 spring和mybatis整合

    1       spring和mybatis整合 1.1     整合思路 需要spring通过单例方式管理SqlSessionFactory. spring和mybatis整合生成代理对象,使用Sq ...