如何使用百分比设置表格单元格的最大宽度? [英] How can I set the max-width of a table cell using percentages?

查看:52
本文介绍了如何使用百分比设置表格单元格的最大宽度?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

<table>
<tr>
<td>Test</td>
<td>A long string blah blah blah</td>
</tr>
</table>

<style>
td{max-width:67%;}
</style>

以上方法无效.如何使用百分比设置表格单元格的最大宽度?

The above does not work. How can I set the max-width of a table cell using percentages?

推荐答案

根据 在 CSS 2.1 规范中定义 max-width,'min-width' 和 'max-width' 对表格、内联表格、表格单元格、表格列和列组的影响未定义."所以你不能直接在 td 元素上设置 max-width.

According to the definition of max-width in the CSS 2.1 spec, "the effect of 'min-width' and 'max-width' on tables, inline tables, table cells, table columns, and column groups is undefined." So you cannot directly set max-width on a td element.

如果您只想让第二列最多占据 67%,那么您可以将宽度(实际上是表格单元格的最小宽度)设置为 33%,例如在示例案例中

If you just want the second column to take up at most 67%, then you can set the width (which is in effect minimum width, for table cells) to 33%, e.g. in the example case

td:first-child { width: 33% ;}

为两列设置它不会那么好用,因为它往往会使浏览器使列的宽度相等.

Setting that for both columns won’t work that well, since it tends to make browsers give the columns equal width.

这篇关于如何使用百分比设置表格单元格的最大宽度?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆