0

ヘッダーのクラスに基づいて、テーブルの列を整列させたいと考えています。たとえば、次のテーブルがあるとします。

<table>
    <thead>
        <th>Name</th>
        <th class="price">Price</th>
    </thead>
    <tbody>
        ....
    </tbody>
<table>

:nth-of-type を使用できることはわかっていますが、列が 2 番目になることもあれば、5 番目になることもあり、いくつかの場所では、同じテーブル内の複数の列が右に揃えられます。

それを達成する方法はありますか？従来のブラウザーをサポートする必要はありません。Internet Explorer 9 でさえサポートする必要はありません (Chrome および/または firefox で動作する場合は、私にとっては十分です)。

明確にするために、先頭の列に関連付けられた本文にある列のテキストを揃えたい

4

2 に答える 2

1

classいいえ、スタイルが列ヘッダーの属性に依存するように、テーブル セルのスタイルを設定することはできませんth。セルをそのように接続する CSS はありません。

列を整列する最も確実な方法は、列class内の各セルに属性を生成することです。技術的には、HTMLalign属性を使用するとさらに堅牢になります。

于 2013-07-14T16:49:19.733 に答える
0

編集:以下にコメントされているように、これはいくつかのプロパティでのみ機能します。テキストアラインは含まれていません。

これを CSS に入れます。

col.price { text-align:right; }

そしてあなたのHTML：

<table>
  <col />
  <col class="price" />
  <tr>
    <td>First TD of first TR</td>
    <td>9,95</td>
  </tr>
  <tr>
    <td>First TD of second TR</td>
    <td>4,85</td>
  </tr>
</table>

参照: http://quirksmode.org/css/css2/columns.html

于 2013-07-14T15:20:38.727 に答える