表格列宽怎么设置都无效?(td内容自动换行问题)

  有次设置表格列宽时,显示的实际宽度与设置的宽度不一致,且无规律变化。最后,在查找资料后发现,可能是td内容 自动换行 的问题。因为表格中的内容有中文、英文字母、还有数字,以及三者的各种组合,所以换行的方式不一致,导致列宽变化。(个人分析,不妥之处请拍砖。)

  所以添加以下css可以解决问题:

  table{ word-break:break-all ; word-wrap:break-word }

  说明:

  (1) word-break:break-all:截断单词进行换行。

  (2) word-wrap:break-word:若行尾不足以容下这个单词,自动把整个单词放到下一行。

  

时间: 2024-10-22 19:57:58

表格列宽怎么设置都无效?(td内容自动换行问题)的相关文章

jQuery表格列宽可变,兼容firfox

本demo使用jQuery包,实现表格列宽可拖拽功能,并实现页面reset时的重新布局.使用jQuery,方便函数的调用,给要处理的表格添加id 后,直接调用$("#id").movedTh()即可方便实现,修改了firfox的兼容性. 代码如下: [javascript] view plaincopy <html> <head> <meta http-equiv="Content-Type" content="text/ht

使用jqueryUI实现自由调整表格列宽

今天项目中需要插入表格,用Excel表格调整列宽时,想怎么拖就怎么拖,于是乎就让插入的表格也这么让人舒服.网上查找许久,没找到好用的方案.最后发现jQuery UI中的resizable()方法可以实现div的自由调整,既然可以在div上实现,那表格也应该没问题吧.于是就动手折腾,成功搞定. 代码详情: main.jsp <%@ page language="java" contentType="text/html; charset=UTF-8" pageEn

设置tablewidget自适应列宽和设置自动等宽

  在网上很容易知道自适应列宽,100%不留空显示,这里还是提下: /*设置表格是否充满,即行末不留空*/ ui->tableWidget->horizontalHeader()->setStretchLastSection(true);   设置了100%不留空后的效果:    在QT5之前,只要通过下面的程序就可以实现自动等宽: /*QT5版本之前设置自动等宽*/ ui->tableWidget->horizontalHeader()->setResizeMode(

使用百分比固定的table大小中td内容自动换行问题

连续的英文或数字能是容器被撑大,不能根据容器的大小自动换行,对于Div和table以及不同的浏览器,实现css自动换行的方法都稍有不同,下面分别介绍: 对于div 1.(IE浏览器)white-space:normal; word-break:break-all;这里前者是遵循标准. 以下是引用片段:#wrap{white-space:normal; width:200px; } 或者 #wrap{word-break:break-all;width:200px;} <div id="wr

jQuery可调整表和列宽插件-colResizable

最基本的例子 引入JS <script src="js/jquery-1.8.0.min.js" type="text/javascript"></script> <script src="js/colResizable-1.6.js" type="text/javascript"></script> 1 2 TABLE <table class="table t

Web界面开发工具!Kendo UI for jQuery数据管理之网格列宽

Kendo UI for jQuery R1 2020 SP1试用版下载 Kendo UI目前最新提供Kendo UI for jQuery.Kendo UI for Angular.Kendo UI Support for React和Kendo UI Support for Vue四个控件.Kendo UI for jQuery是创建现代Web应用程序的最完整UI库. 要设置Grid列的宽度,请使用其width属性. 当您通过col元素从HTML表创建网格时,也可以设置列的宽度:但是,当对表

[转]简单的动态修改RDLC报表页边距和列宽的方法

本文转自:http://star704983.blog.163.com/blog/static/136661264201161604413204/ 1.修改页边距 XmlDocument XMLDoc = new XmlDocument(); XMLDoc.Load(System.Windows.Forms.Application.StartupPath + @"\Report_try-2.rdlc"); XmlNamespaceManager xmn = new XmlNamespa

从零开始学_JavaScript_系列(十)——dojo(3)(GRID表格创建、样式、列宽可变、排序、过滤器)

(34)gridx gridx系列插件并非和dojo的插件在一起 需要下载的请通过以下网址下载: http://oria.github.io/gridx/ 不过我也不太懂不同版本有什么区别(事实上我对gridx还属于新手水平) PS:dojo本身有dojox/grid插件,语法和gridx并不同,所以不能混用. PSS: 由于看这篇帖子的人,基本没办法自己和服务器/数据库互动,所以建议自己写一个json文件,然后get这个json文件(具体看之前的AJAX相关的,很简单,或者使用我下面给的例子也

1. DataGridView设置字体、行高、列宽、单列居中

DataGridView表格内容的列宽.行高.字体的设置,设置某一列居中.一般地,会将行高设为统一的,列宽根据不同情况设定. [csharp] view plaincopyprint? // 调整字体 dataGridView1.Font = new Font("宋体", 11); // 调整行高 //dataGridView1.Rows[0].Height = 100; dataGridView1.RowTemplate.Height = 30; dataGridView1.Upda