ネストされたtdを持つHTMLテーブル

マニックス

'Top 10'テーブルヘッダーの下に3つの列を追加しようとしていますが、セルに値を追加するとすべてが破損し、「ID」セルの直前に空のセルがあり、どこから来たのかわかりません

<html>
       <head>
          <title>ss</title>
          <style>
             table { width: 100%; border-collapse: collapse; }
             td { border: 1px solid #000; }
          </style>
       </head>
       <body>
          <center>
             <table border="1">
                <thead>
                <tr>
                   <th align="center">
                      <font face="Arial, Helvetica, sans-serif"></font>
                   </th>
                   <th align="center">
                      <font face="Arial, Helvetica, sans-serif">Site</font>
                   </th>
                   <th colspan="4" align="center">
                      <font face="Arial, Helvetica, sans-serif">Top 10</font>
                   </th>
                </tr>
             </thead>

        <!-- Table Content -->
        <tbody>
      <tr>
        <td align="center">
            <font face="Arial, Helvetica, sans-serif">1</font>
        </td>
        <td align="center">
            <font face="Arial, Helvetica, sans-serif">example</font>
        </td>
        <td>
            <td>ID</td>
            <td >Name</td>
            <td>From</td>
       </td>
    </tr>

       </tbody>
             </table>
          </center>
       </body>
    </html>

あなたの助けはありがたいです

キーズハク

テーブルのHTMLは完全にオフになっています。適切な要素を使用し、すべてを閉じるようにしてください。そして、可能な限りCSSでスタイリングを適用するようにしてください。

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

td,
th {
    border: 1px solid #000000;
}
<table>
    <thead>
        <tr>
            <th></th>
            <th>Site</th>
            <th colspan="3">Top 10</th>
        </tr>
    </thead>

    <tbody>
        <tr>
            <td rowspan="2">1</td>
            <td rowspan="2">Example</td>
            <td>ID</td>
            <td>Name</td>
            <td>From</td>
        </tr>
        
        <tr>
            <td>1</td>
            <td>Kobo</td>
            <td>Jack</td>
        </tr>
    </tbody>
</table>

この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。

侵害の場合は、連絡してください[email protected]

編集
0

コメントを追加

0

関連記事

分類Dev

ネストされたデータソースを持つAngularMaterialテーブル

分類Dev

2つのテーブルを持つネストされたグリッド

分類Dev

動的IDを持つネストされたテーブルのボタン

分類Dev

すべての行内にネストされたテーブルを持つDatatable

分類Dev

Xpath-テキスト値を保持するテーブルを持つ複数のネストされたdiv

分類Dev

htmlネストされたテーブル最初にテーブル行をクリックしてテーブル行を非表示または表示するtd

分類Dev

Angulardart でネストされたリストを持つテーブルを作成する

分類Dev

Pythonでネストされたループを持つテーブルを作成する

分類Dev

ネストされたオブジェクトを持つ無限ループ

分類Dev

ネストされた「SELECTWHERE」を持つCodeigniterアクティブレコード

分類Dev

独立したネストされたループを持つBigO

分類Dev

XPathでネストされたテーブルのtdテキスト値を取得する方法

分類Dev

ネストされたテーブルを持つ親テーブルをターゲットにするjQueryの:has()の反対は何ですか

分類Dev

ネストされたjsonを複数のネストを持つテーブルとしてインポートする

分類Dev

javascriptの条件を持つネストされたループ

分類Dev

Androidルーム:ネストされたDAOを持つDAO

分類Dev

Java-ネストされたループを持つpaintComponent

分類Dev

htmlネストされたテーブルテーブル行の最初のtdをクリックして、テーブルの最後のtdを非表示または表示

分類Dev

折りたたみ可能な行を持つネストされたテーブルが正しく表示されないのはなぜですか?

分類Dev

ネストされた配列を持つクラスオブジェクトをデータテーブルに変換する方法は?

分類Dev

異なるステップと依存するステップを持つネストされたループ

分類Dev

PySpark:リレーショナルテーブルにネストされたフィールドを持つデータフレーム

分類Dev

フラットテーブルデータフレームをネストされた配列を持つデータフレームに変換する方法

分類Dev

深くネストされたルートを持つAngular2ルーティングv3.0.0

分類Dev

Zuulはネストされたパスを持つサービスにルーティングします

分類Dev

ネストされた式テンプレートを持つC ++クラス

分類Dev

JavaScript:ネストされた配列を持つオブジェクトをReactのテーブルにマップする方法

分類Dev

複数の値を持つネストされた配列を持つJavaScriptオブジェクトにifステートメントを組み込む

分類Dev

ネストされた配列を持つネストされたオブジェクトを持つMongoDB $ lookup

Related 関連記事

  1. 1

    ネストされたデータソースを持つAngularMaterialテーブル

  2. 2

    2つのテーブルを持つネストされたグリッド

  3. 3

    動的IDを持つネストされたテーブルのボタン

  4. 4

    すべての行内にネストされたテーブルを持つDatatable

  5. 5

    Xpath-テキスト値を保持するテーブルを持つ複数のネストされたdiv

  6. 6

    htmlネストされたテーブル最初にテーブル行をクリックしてテーブル行を非表示または表示するtd

  7. 7

    Angulardart でネストされたリストを持つテーブルを作成する

  8. 8

    Pythonでネストされたループを持つテーブルを作成する

  9. 9

    ネストされたオブジェクトを持つ無限ループ

  10. 10

    ネストされた「SELECTWHERE」を持つCodeigniterアクティブレコード

  11. 11

    独立したネストされたループを持つBigO

  12. 12

    XPathでネストされたテーブルのtdテキスト値を取得する方法

  13. 13

    ネストされたテーブルを持つ親テーブルをターゲットにするjQueryの:has()の反対は何ですか

  14. 14

    ネストされたjsonを複数のネストを持つテーブルとしてインポートする

  15. 15

    javascriptの条件を持つネストされたループ

  16. 16

    Androidルーム:ネストされたDAOを持つDAO

  17. 17

    Java-ネストされたループを持つpaintComponent

  18. 18

    htmlネストされたテーブルテーブル行の最初のtdをクリックして、テーブルの最後のtdを非表示または表示

  19. 19

    折りたたみ可能な行を持つネストされたテーブルが正しく表示されないのはなぜですか?

  20. 20

    ネストされた配列を持つクラスオブジェクトをデータテーブルに変換する方法は?

  21. 21

    異なるステップと依存するステップを持つネストされたループ

  22. 22

    PySpark:リレーショナルテーブルにネストされたフィールドを持つデータフレーム

  23. 23

    フラットテーブルデータフレームをネストされた配列を持つデータフレームに変換する方法

  24. 24

    深くネストされたルートを持つAngular2ルーティングv3.0.0

  25. 25

    Zuulはネストされたパスを持つサービスにルーティングします

  26. 26

    ネストされた式テンプレートを持つC ++クラス

  27. 27

    JavaScript:ネストされた配列を持つオブジェクトをReactのテーブルにマップする方法

  28. 28

    複数の値を持つネストされた配列を持つJavaScriptオブジェクトにifステートメントを組み込む

  29. 29

    ネストされた配列を持つネストされたオブジェクトを持つMongoDB $ lookup

ホットタグ

アーカイブ