0

だから私はこのようなテーブルを持っています: http://img607.imageshack.us/img607/5295/1stv.jpg

しかし、私はこのようなことをしたい: http://img684.imageshack.us/img684/3500/2ndjn.jpg

左の列の高さは固定されていません。右側の行番号も固定ではありません。私の2番目の例のように、右側の行が左側の列の高さで均等に引き伸ばされ、ギャップ全体が一番下まで埋められるようにしたいだけです。

4

2 に答える 2

0

これはうまくいくかもしれません：

HTML

<table>
  <tr>
    <th rowspan="0">pic</th>
      <td>text</td>
      <td>text</td>
  </tr>
    <tr>
      <td>text</td>
      <td>text</td>
    </tr>
    <tr>
      <td>text</td>
      <td>text</td>
    </tr>
</table>

CSS

table {
  table-layout: fixed;
  border-collapse: collapse;
  width: 100%;
}

td, th{
  border: 1px solid #000;
  width: auto;
}

td+th {
  width: auto;
}

th {
  height:300px;
}

thCSSで a の高さを変更するか、異なるサイズの画像をセルに追加するだけです。HTML に可変数の行を追加することもできます。

ノート！rowspan=0Firefox と Opera でのみ動作する可能性があります。少なくとも Safari では動作しません。行数が事前にわからない場合、または行数を動的に使用phpまたは決定できない場合は、左に画像を追加し、その右に 2 列のテーブルを追加することをお勧めします。JavaScript

この回答も参照してください: Table with table-layout: fixed; 1つの列を広くする方法

于 2012-09-18T11:58:22.620 に答える
0

あなたはそれを試すことができますtable-layout:fixed

<table style='table-layout:fixed;'>
<tr>
<td>Hello World</td>
<td>Hello World</td>
</tr>
<tr>
<td>Hello World</td>
<td>Hello World</td>
</tr>
<tr>
<td>Hello World</td>
<td>Hello World</td>
</tr>
</table>

次に、列と行に可能な限り幅と高さを設定します

于 2012-09-18T06:45:01.987 に答える