遇到一长串字母撑出了td宽度,导致整个表格错乱,如图:

解决办法:

第一:

table 加上css: table-layout: fixed;(此css属性 表示 列宽由表格宽度和列宽度设定。不会因为内容而改变设定的宽高,而是会自适应外面的容器)。

第二:

td 加上css: word-wrap: break-word;(此css属性表示  在长单词或 URL 地址内部进行换行)。

效果如图:

设置table中的td一连串内容自动换行的更多相关文章

  1. css中设置table中的td内容自动换行

    word-break:break-all和word-wrap:break-word都是能使其容器如DIV的内容自动换行. 它们的区别就在于: 1,word-break:break-all 例如div宽 ...

  2. table中的td限制宽度width也不能让字符过长变成省略号生效?

    table中的td限制宽度width也不能让字符过长变成省略号生效? http://blog.csdn.net/java_mr_zheng/article/details/49423247 CSS t ...

  3. 【js】将table的每个td的内容自动赋值给其title属性

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  4. table表格td内内容自动换行

    项目开发时,遇到问题:td内传入数据,全是字母,不会自动换行 一般字母数字/特殊符号的话,会被浏览器默认是一个字符串或者说一个单词,不会自动换行 所以需要设置一下,让表格内容自动换行. 1.给td标签 ...

  5. table中的td内容过长显示为固定长度,多余部分用省略号代替

    如何使td标签中过长的内容只显示为这个td的width的长度,之后的便以省略号代替. 给table中必须设置属性: table-layout: fixed; 然后给 td 设置: white-spac ...

  6. table中的td等长(不随内容大小变化)

    使用的table时候发现td的长度是随着内容的大小而变化的,但是有的时候我们不希望这样.想要td等长可以在 tbale中加上         style=“table-layout:fixed”   ...

  7. jquery获取table,遍历输出tr中各个td的内容(转载)

    首先,依赖jquery.. 1 $('#btntb').click(function(){ 2 $('#tab tr').each(function(i){ // 遍历 tr 3 $(this).ch ...

  8. jquery、js获取table,遍历输出tr中各个td的内容。

    首先,依赖jquery.. $('#btntb').click(function(){ $('#tab tr').each(function(i){ // 遍历 tr $(this).children ...

  9. Jquery Ajax 异步设置Table中某列的值

    可根据table中某列中的ID去改变某列的值! 只是参考,实际应用中不能这样做的,如果有很多行,频繁访问服务器,服务器是顶不住的! JS: $(document).ready(function () ...

随机推荐

  1. You Don't Know JS: this & Object Prototypes( 第4章 Mixing "Class" Objects)

    本章移到“Object oriented programming”和"classes". 看‘class orientation‘ 的设计模式: instantiation, in ...

  2. js时间字符串转为标准时间

    //将字符串转换为时间格式,适用各种浏览器,格式如2016-09-09T17:02:37.227"function GetTimeByTimeStr(dateString) { var ti ...

  3. 安装redisPHP扩展

    1. "predis/predis":"~1.1@dev" 2.composer update 即可,这是给项目添加redis扩展 启动服务端 redis-se ...

  4. bat安装python的msi包

    #把python-2.7.3.amd64.msi和这个脚本放在同一个目录下   @ECHO OFF ::定于初始变量SET python_home=C:\Python27SET python_exe= ...

  5. hdu-3671-tarjin/割点方案

    http://acm.hdu.edu.cn/showproblem.php?pid=3671 给出一幅无向图,询问有多少种移除点对的方案使得剩下的连通分量个数大于1. 和上一题差不多的思路直接做n次t ...

  6. 重写nyoj2——括号匹配

    #include "bits/stdc++.h" using namespace std; int comp(char s1,char s2){ ; ; } int main() ...

  7. 大数据分析引擎Apache Flink

    Apache Flink是一个高效.分布式.基于Java实现的通用大数据分析引擎,它具有分布式 MapReduce一类平台的高效性.灵活性和扩展性以及并行数据库查询优化方案,它支持批量和基于流的数据分 ...

  8. Elastic-Job 介绍

    Elastic-Job是一个分布式调度解决方案,它解决了什么问题呢? 如果你需要定时对数据进行处理,但由于数据量实在太大了,一台机器处理不过来,于是用两台机器处理,第一台处理 id 为奇数的数据,第二 ...

  9. hosts.allow和hosts.deny支持哪些服务

    一.背景简介 在linux上多用iptables来限制ssh和telnet,编缉hosts.allow和hosts.deny感觉比较麻烦比较少用. aix没有iptables且和linux有诸多不同, ...

  10. TCP可靠传输:校验和,重传控制,序号标识,滑动窗口、确认应答

    Tcp通过校验和,重传控制,序号标识,滑动窗口.确认应答实现可靠传输 应答码:ACK TCP的滑动窗口机制       TCP这个协议是网络中使用的比较广泛,他是一个面向连接的可靠的传输协议.既然是一 ...