有时候表格会因为内容多少忽大忽小的很烦人,在网上搜了下解决方案,效果不错哦,给大家分享下! 首先介绍两个利器: table-layout:fixed //固定表格大小 word-break:break-all;//字符串自动换行 注意:IE和firefox是有很大区别的!(我就是栽在这个上面了,⊙﹏⊙b汗) 1. (IE浏览器)使用 table-layout:fixed;强制table的宽度,多余内容隐藏 <table style="table-layout:fixed" width="200"> 2.(IE浏览器)使用 table-layout:fixed;强制table的宽度,内层td,th采用word-break : break-all;或者word-wrap : break-word ;换行 <table width="200" style="table-layout:fixed;"> <tr> <td width="25%" style="word-break : break-all; ">abcdefghigklmnopqrstuvwxyz 1234567890 3.(Firefox浏览器)连续的英文字符和阿拉伯数字的断行,Firefox的所有版本的没有解决这个问题,我们只有让超出边界的字符隐藏或者,给容器添加滚动条 4.(Firefox浏览器)使用 table-layout:fixed;强制table的宽度,内层td,th采用word-break : break-all;或者word-wrap : break-word ;换行,使用overflow:hidden;隐藏超出内容,这里overflow:auto;无法起作用 <table style="table-layout:fixed" width="200"> <tr> <td width="25%" style="word-break : break-all; overflow:hidden; ">abcdefghigklmnopqrstuvwxyz1234567890</td> |
html表格内容自动换行
转载
学习时的痛苦是暂时的 未学到的痛苦是终生的
本文章为转载内容,我们尊重原作者对文章享有的著作权。如有内容错误或侵权问题,欢迎原作者联系我们进行内容更正或删除文章。
上一篇:DHCP安装配置详解
下一篇:根据经纬度计算多边形面积

提问和评论都可以,用心的回复会被更多人看到
评论
发布评论
相关文章
-
【Web前端】CSS 样式化表格
表格在网页设计中扮演了重要角色,尤其是在展示数据和信息时。尽管 HTML 表格提供了结构化的数据展示,但要使其看起来既美观又实用,CSS 样式化至关重要。
css html 前端 css3 html表格 -
CSS自动换行
这样的一个表:或xxxx或 在其中xxxx的位置放网址,由于有的网址很长,于是在IE的浏览器里就会不换行,或者是很长一
CSS IE Firefox 浏览器 -
bootstrap表格自动换行
用bootstrap的时候表格如果内容太长,会撑爆整个页面,我们可以使用css使他可
css bootstrap 自动换行