首页   技术笔记   网址导航   Json在线解析   二维码   Ip地址查询   在线流程图  
新用户注册 | 会员登录
当前位置:  开发笔记 > 前端 > 正文

如何在HTML或CSS中指定表格单元格的绝对最小宽度

作者：黄晓敏3023 | 2023-09-05 17:48
如何解决《如何在HTML或CSS中指定表格单元格的绝对最小宽度》经验，为你挑选了3个好方法。

这个CSS应该足够了:

td { min-width: 100px; }

但是,所有浏览器并不总是正确地遵守(min-width属性)(例如,IE6不喜欢它).

编辑:至于IE6(以及之前的)解决方案,据我所知,在任何情况下都没有可靠的工作方式.使用nowrap HTML属性并不能真正实现所需的结果,因为这样可以防止单元格中的换行符,而不是指定最小宽度.

然而,如果NOWRAP结合使用与常规小区width属性(例如,使用宽度:100像素)时,100像素将作用像的最小宽度和所述小区仍然将与文本膨胀(由于NOWRAP).这是一个不太理想的解决方案,无法使用CSS完全应用,因此,如果您希望将许多表应用于此,则实施起来会非常繁琐.(当然,如果你想在你的单元格中使用动态换行符,这整个替代解决方案都会失败).



1> James B..：

这个CSS应该足够了:

td { min-width: 100px; }

但是,所有浏览器并不总是正确地遵守(min-width属性)(例如,IE6不喜欢它).

编辑:至于IE6(以及之前的)解决方案,据我所知,在任何情况下都没有可靠的工作方式.使用nowrap HTML属性并不能真正实现所需的结果,因为这样可以防止单元格中的换行符,而不是指定最小宽度.

然而,如果NOWRAP结合使用与常规小区width属性(例如,使用宽度:100像素)时,100像素将作用像的最小宽度和所述小区仍然将与文本膨胀(由于NOWRAP).这是一个不太理想的解决方案,无法使用CSS完全应用,因此,如果您希望将许多表应用于此,则实施起来会非常繁琐.(当然,如果你想在你的单元格中使用动态换行符,这整个替代解决方案都会失败).



2> Michael Hare..：

另一个黑客是旧的1x1透明像素技巧.插入1x1透明gif图像,并将其在图像标记中的宽度设置为所需的宽度.这将迫使细胞至少与图像一样宽.

是否存在跨浏览器CSS的黑客攻击？我认为只有标准和"人们真正做的事情".
这是一个相当过时的黑客...有更好的方法来解决这个问题,而不需要为它加载单独的图像,即使其他方法也是黑客攻击.

3> Partack..：

我知道这是一个古老的问题,但我想我会分享一些未被提及的东西(虽然在概念上非常简单..)你可以把一个

放在桌子里面(在其中一个或者什么中)然后设置
到min-width.桌子将停在
宽度处.只是想我会把它扔出去,万一有人在谷歌遇到这个.另外,我不太确定在I.E6中如何处理最小宽度.但这已经在另一个答案中得到了解释.

推荐阅读
devbox
黄晓敏3023
这个屌丝很懒，什么也没留下！
关注作者
Tags | 热门标签
RankList | 热门文章
DevBox开发工具箱 | 专业的在线开发工具网站    京公网安备 11010802040832号  |  京ICP备19059560号-6
Copyright © 1998 - 2020 DevBox.CN. All Rights Reserved devBox.cn 开发工具箱 版权所有