1

私は HTML が初めてで、CSS で列の幅を指定できる基本的なテーブルを作成しようとしています。

アカウントの HTML セット (35 ページのドキュメント) を作成しているので、テーブルは作成する必要があるものの基礎であり、html 全体で使用される約 5 つの標準テーブルがあります。

私は簡単に行ってみましたが、以下のコードは私が必要としていたものとまったく同じように見えましたが、td:first-child は IE では機能しません。

検索しましたが、サポートされています。誰が私が間違っているのか教えてもらえますか? また、これを行うためのより良い方法があれば教えてください。

<html>
<head>
    <title>Company Accounts</title>
    <style type="text/css">
        table { width: 264mm; border: 1px solid; table-layout:fixed}
        td {border: 1px solid; padding: 5px}

        .T1C1 td:first-child {width: 10mm; text-align:right}
        .T1C2 td:first-child + td {width: 50mm}
        .T1C3 td:first-child + td + td {width: 10mm; text-align:right}
        .T1C4 td:first-child + td + td + td {width: 50mm; text-align:right}
    </style>
</head>
<body>
    <table class="T1C1 T1C2 T1C3 T1C4">
        <tr> <td>1</td> <td>2</td>  <td>3</td>  <td>4</td> </tr>
        <tr> <td>1</td> <td>2</td>  <td>3</td>  <td>4</td> </tr>
        <tr> <td>1</td> <td>2</td>  <td>3</td>  <td>4</td> </tr>
        <tr> <td>1</td> <td>2</td>  <td>3</td>  <td>4</td> </tr>
        <tr> <td>1</td> <td>2</td>  <td>3</td>  <td>4</td> </tr>
    </table>
</body>
</html>
4

2 に答える 2

2

:first-child疑似クラスは、互換モードの IE でサポートされていない多くの CSS 機能の1 つです。これが、コメントに記載されているように、doctype の追加が役立つ理由です。しかし、それは単なるDoctypeではありません。など、IE で「標準モード」をトリガーするもの<!doctype html>で、HTML ドキュメントの最初に配置する必要があります。

この特定の癖については、Microsoft のドキュメントで明示的に説明されています。 http://msdn.microsoft.com/en-us/library/ie/cc848865%28v=vs.85%29.aspx ただし、ドキュメント内の「厳密」という言葉は誤解を招く可能性があります。リンクされたページ http://msdn.microsoft.com/en-us/library/ie/ms535242%28v=vs.85%29.aspx HTML5 doctype<!doctype html>も機能します。

于 2012-09-12T10:09:21.050 に答える
0

この css 疑似クラスのリファレンスは次のとおりです: https://developer.mozilla.org/en-US/docs/CSS/:first-child

そこにブラウザの互換性表があります。

ページの下部に IE に関するいくつかの警告があります。

要素が動的に追加されると、Internet Explorer 7 はスタイルを更新しません。Internet Explorer 8 では、リンクをクリックして要素が動的に挿入される場合、最初の子スタイルはリンクがフォーカスを失うまで適用されません。

于 2012-09-12T08:18:32.323 に答える