对于有很多条目的数据,通常采用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. 【BZOJ】2929: [Poi1999]洞穴攀行(最大流)

    http://www.lydsy.com/JudgeOnline/problem.php?id=2929 题意描述不清..搞得我wa了一发.. 应该是,有1和n的点的边容量都为1,其余随便... 然后 ...

  2. li:hover在ie6下失效的解决方案

    li:hover在ie6下是无效的,它只在ie7以下版本有效.要解决这个问题有两个解决方法.一个是用js来解决,但是这种方法我不喜欢,因为它必需把js代码和css代码都放在html文件中.第二种是在每 ...

  3. [FlyCapture2] Bumblebee XB3 Save Images to Three AVI Files (Left, Center and Right) 大黄蜂立体相机保存捕获的视频到左中右三个不同的文件

    PointGreyResearch是世界领先的致力于开发高级数字相机产品的公司.PointGrey产品涉及IEEE-1394相机.立体视觉相机和360度全景数字视频相机.其中二代和三代的大黄蜂立体相机 ...

  4. Linux环境下实现哲学家就餐问题

    #include <stdio.h> #include <stdlib.h> #include <memory.h> #include <pthread.h& ...

  5. visio studio2008 删除最近的项目

    visio studio2008  删除最近的项目 创建move.bat: @echo off @REG Delete HKCU\Software\Microsoft\VisualStudio\9.0 ...

  6. Ubuntu 开启 Crontab 计划任务日志

    Ubuntu 下的 Crontab 日志功能不是自动开启的.开启日志功能的步骤是: ① 修改 rsyslog sudo vim /etc/rsyslog.d/-default.conf 找到: #cr ...

  7. 【翻译】CEDCE2010 制作魅力绘制而要知道的光学小知识

    关于Silicon Studio 个人觉得他们的后处理技术在国际上还是有相对水准的,而且不少日系游戏也采用了他们的全平台YEBIS 3的中间件.   YEBIS 3的特性可以看下这个  http:// ...

  8. PHP 下载导出中文名的文件的编码注意事项

    我的页面全部都为utf-8 在代码中我的文件名是中文名. 在创建文件时,就要将utf-8转码成gbk(用以支持中文) $file = iconv('utf-8',"gbk",$fi ...

  9. ecshop session机制

    ecshop session机制 2014-06-12    1455     懒人程序   ecshop的cls_session.php分析,主要是讲述ecshop中的session机制.我们都知道 ...

  10. Web Service性能测试方案

    目录: 1.web Service简介 2.SoapUI介绍 3.使用SoapUI进行web service性能测试 4.使用LR进行web service性能测试 5.使用JMeter进行web s ...