`
yzy541
  • 浏览: 9607 次
  • 性别: Icon_minigender_1
  • 来自: 济南
最近访客 更多访客>>
社区版块
存档分类
最新评论

html网页table/td自动换行

阅读更多
大家都知道页面中td要不换行,需加上nowrap。

而有些地方必须根据内容而自动换行,解决该问题的方法有以下两种:

1.在table里增加样式:table{table-layout: fixed;}

以下引用table-layout的说明

语法:

table-layout : auto | fixed

参数:

auto :  默认的自动算法。布局将基于各单元格的内容。表格在每一单元格读取计算之后才会显示出来。速度很慢

fixed :  固定布局的算法。在这算法中,水平布局是仅仅基于表格的宽度,表格边框的宽度,单元格间距,列的宽度,而和表格内容无关

说明:

设置或检索表格的布局算法。

对应的脚本特性为tableLayout。请参阅我编写的其他书目。

示例:

table { table-layout: auto; }

2.在td里增加样式:td{word-break: break-all; word-wrap:break-word;}

以下引用word-break的说明

语法:

word-break : normal | break-all | keep-all

参数:

normal :  依照亚洲语言和非亚洲语言的文本规则,允许在字内换行

break-all :  该行为与亚洲语言的normal相同。也允许非亚洲语言文本行的任意字内断开。该值适合包含一些非亚洲文本的亚洲文本

keep-all :  与所有非亚洲语言的normal相同。对于中文,韩文,日文,不允许字断开。适合包含少量亚洲文本的非亚洲文本

说明:

设置或检索对象内文本的字内换行行为。尤其在出现多种语言时。

对于中文,应该使用break-all 。

对应的脚本特性为wordBreak。请参阅我编写的其他书目。

示例:

div {word-break : break-all; }
分享到:
评论

相关推荐

    html中表格td内容自动换行

    html中让表格td中的多余字体自动换行的

    IText Html生成PDF支持中文、英文和数字换行

    经过大牛修改后的core-renderer.jar,当把HTML转化成PDF时支持table的td中的中文、英文和数字自动换行,table必须添加样式table-layout:fixed;word-break:break-strict;

    html转pdf,ITEXT转HTML为PDF解决中文不换行问题

    1、core-renderer.jar该jar包修改过中文不换行问题 public static String getConversionHtmlCode(String linkcss,String htmlCode,String title){ String css = ""; css +="<style>"; css +="table{"; ...

    使用iText进行HTML转PDF解决中英文不换行bug

    xhtmlrenderer 进行HTML转PDF,修改了core-renderer-R8的源码,兼容中英文换行,且保持对英文单词完整性,亲测可用。

    itext生成pdf解决中英文换行问题

    导入 <groupId>org.xhtmlrenderer</groupId> <artifactId>core-renderer</artifactId> <version>R8</version> </dependency> 直接根目录下新建包org.xhtmlrenderer.layout 覆盖jar

    css之自动换行实现代码

    对于div,p等块级元素 正常文字的换行(亚洲文字和非亚洲文字)元素拥有默认的white-space:normal,当定义的宽度之后自动换行 html 正常文字的换行(亚洲文字和非亚洲文字)元素拥有默认的white-space:normal,当定义</div>...

    asp学习笔记

    p 段落标签,自动换行 块级标签 <br/> 换行标签 <hr/> 划线标签 b 加粗标签 <ul/> 列表标签,配合li使用 (2/3/4/...)/> 标题标签 table 表格标签 tr 行标签 td 列表签 th 标题标签 *属性: ;"> <table ...

    privateprivateprivateprivate

    //设置自动换行 //format1.setWrap(true); //添加一个工作表 WritableSheet sheet = book.getSheet(0); sheet.addCell(new Label(2, 6, txrq, format1)); // sheet.addCell(new Label(11, 6, yycode,...

    private2private2private2

    //设置自动换行 //format1.setWrap(true); //添加一个工作表 WritableSheet sheet = book.getSheet(0); sheet.addCell(new Label(2, 6, txrq, format1)); // sheet.addCell(new Label(11, 6, yycode, ...

    freemarker总结

    2,使用+运算符时,如果一边是数字,一边是字符串,就会自动将数字转换为字符串再连接,如:${3 + "5"},结果是:35 使用内建的int函数可对数值取整,如: ${ (x/2)?int } ${ 1.1?int } ${ 1.999?int } ${ -1.1?int } ...

    js使用小技巧

    让英文字符串超出表格宽度自动换行 word-wrap: break-word; word-break: break-all; 透明背景 <IFRAME src="1.htm" width=300 height=180 allowtransparency></iframe> 获得style内容 obj.style.cssText ...

    从入门到精通HTML5——PDF——网盘链接

     7.1.1 表格的基本构成——table、tr、td 119  7.1.2 表格的标题——caption 120  7.1.3 表格的表头——th 121  7.2 设置表格基本属性 123  7.2.1 表格的宽度——width 123  7.2.2 表格的高度——height...

    CSS 数字和字母将容器撑大问题解决

    对于div,p等块级元素 正常文字的换行(亚洲文字和非亚洲文字)元素拥有默认的white-space:normal,当定义的宽度之后自动换行 html 正常文字的换行(亚洲文字和非亚洲文字)元素拥有默认的white-space:normal,当定义</div>...

    css笔记课程笔记2019,5,22

    * div: 自动换行 * span:在一行显示 CSS 1、css的简介 * css: 层叠样式表 ** 层叠:一层一层的 ** 样式表: 很多的属性和属性值 * 是页面显示效果更加好 * CSS将网页内容和显示样式进行分离,提高了...

Global site tag (gtag.js) - Google Analytics