html表td大小固定且相对混合

时间:2013-04-22 19:36:14

标签: html-table width

例如,

<table width="100%">
  <tr>
     <td width="40"></td> // left margin

     <td width="10">0</td>
     <td width="%"></td>
     <td width="10">3</td>
     <td width="%">0</td>
     <td width="10">6</td>
     <td width="%">0</td>
     <td width="10">9</td>

     <td width="40"></td> // right margin
  </tr>
</table>

我希望固定数字列是固定的,其他是相对的。我各尝试了25%。但仍然没有工作。

1 个答案:

答案 0 :(得分:1)

基于这个问题,我将如何构建它。这是展示代码的JSFiddle

CSS:

table {
    width: 100%;
}

td.fixed {
    position: fixed;
    width: 40%;
}

td.others {
    padding: 0 10px;
    width: 10%;
}

HTML:

<table>
  <tr>
     <td class="fixed"></td>

     <td class="others">0</td>
     <td class="others">3</td>
     <td class="others">6</td>
     <td class="others">9</td>

     <td class="fixed"></td>
  </tr>
</table>