logo标签列表

Style CSS table td

csscss-tables
4
我的网站允许用户使用PHP生成表格。行数和单元格数可变，但列数始终固定。表格通常生成两位数的数字。当表格生成三位数的数字时，整个表格会扩展以适应，从而破坏我的布局。是否有一种方法可以使用CSS并样式化这个表格的td，使得在生成3位数时表格不改变大小（3位数是最长的）？我尝试给表格添加填充，但没有效果。
另外，我应该在表格中使用id还是class？
3个回答
11
td {
  width: 50px;
}

我认为这样的代码也许适合你。当然，你可以根据需要调整实际宽度。

如果你有多个表格，并且只想固定其中一个，请给该表格添加一个id：

<table id="fixed_table">

然后在CSS中，你可以这样写：

#fixed_table td {
  width: 50px;
}

这只会影响特定表格中的td。当然，如果您想影响某些表格但不影响其他表格，您可以使用类而不是id。

3
你可以使用width和max-width的组合来实现：
td {
    border: 1px solid #ccc;
    width: 2em; /* or whatever... */
    max-width: 2em; /* or whatever... */
    height: 2em; /* or whatever... */
    line-height: 2em; /* or whatever... */
    text-align: center; /* a personal aesthetic choice... */
    overflow: hidden; /* to prevent overflow... */
}

JS Fiddle演示。

请注意，在演示中我使用jQuery仅仅是为了生成内容，但这并不是演示所必需的。

2

在列上设置固定宽度。

是的。你可以将它设置为所有列，例如 td {width:100px;} 或者针对特定列给予一个类名，例如 .col {width:100px;}。 - joakimdahlstrom
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接