ホームページ  >  記事  >  ウェブフロントエンド  >  HTML Web ページテーブルの構造化マークアップの適用に関する簡単な説明

HTML Web ページテーブルの構造化マークアップの適用に関する簡単な説明

高洛峰
高洛峰オリジナル
2017-02-10 10:26:461469ブラウズ

次のエディタでは、HTML Web テーブルの構造化タグの適用について簡単に説明します。編集者はこれがとても良いと思ったので、参考として共有します。エディターに従って、Web テーブルの構造化マークアップについて説明する前に、いくつかの写真を見てみましょう。

HTML Web ページテーブルの構造化マークアップの適用に関する簡単な説明

HTMLテーブルの構造 いわゆる構造化とは、上の最初の図に示すように、テーブルをヘッダー、ボディ、フッターの3つのタイプに分割することです。したがって、テーブルの本体部分を変更しても、他の 2 つの部分には影響しないため、アプリケーションが分離され、容易になります。

構造化フォーマット


XML/HTMLコード

コンテンツをクリップボードにコピー

  1. テーブル >
  2. thead>thead> --------ヘッダーエリア
  3. 本体 >tbody>--------テーブル本体エリア
  4. tfoot > < ;/tfoot>---------------テーブルテールエリア
  5. 概要: テーブルを3つの部分に分割すると、テーブルを編集します。 HTML テーブルのタイトル

上の 2 番目の図に示すように、各テーブルには独自のタイトルがあります。では、コンテンツに合わせてタイトルを移動させるにはどうすればよいでしょうか?

テーブルのタイトル

XML/HTMLコード

コンテンツをクリップボードにコピー




テーブル>

  1. caption>

  2. caption

  3. >
  4. table

    >

    属性名属性値
  5. 説明
  6. 整列

  7. タイトルは表の上にありますタイトルは表の下にあります

概要:

を設定することで、テーブルのタイトルを変更すると、いつでもタイトルをテーブルとともに移動させることができます。

Html インライン形式

テーブルのインライン形式とは何ですか? Excel でよく目にするのは、列全体に背景色を追加することです。

属性名

属性値

説明

Align


Left

LeftCenterAccepted

Right 右走行

ヴァライン

右にいてください

入力

真ん中

真ん中に固執

下に固執

スパン

数字

シリアル番号

概要:

設定によるテーブルの線形フォーマットにより、必要なコンテンツの色を濃くすることができます。これは列のコンテンツのみです。

ソースコードは次のとおりです:

XML/HTMLコード

コンテンツをクリップボードにコピーします

  1. &lt;html&gt;

    &lt;
  2. li

    &gt; &&lt;tr&gt;

    &gt;
  3. &lt;/

  4. tr
  5. &gt;; =「100%」> tr>

  6. 番目>名前番目>

    th
  7. >

  8. >

    数学> > ;外国語

  9. 番目

    >

  10. tbody> / td>

  11. td > 95td> /

    tr
  12. >

  13. tr>

  14. td>张三td >

  15. td>95td>

  16. td>95 td>

  17. td>95td>

  18. tr >

  19. tr>

  20. td>张三td>

  21. td> ;95td>

  22. td>95td >

  23. td>95td>

  24. tr>

  25. 誰か >

  26. tfoot>

  27. tr>

  28. td colspan=" 4">成绩汇总td>

  29. tr>

  30. >

  31. テーブル>

  32. td>

  33. tr>

  34. テーブル>

  35. br />

  36. li>表格嵌套の使用二li>

  37. table border=「1」 =「500」 >

  38. caption align="bottom">生徒のパフォーマンスcaption>

  39. >

  40. 番目
  41. >

  42. 番目
  43. >中国語番目> ;/th>

  44. 番目>外国語番目>

  45. tr>>

  46. >

    > td>张三td>

  47. td>95

  48. td

    >

  49. td

    >95td

    >
  50. td

    >
  51. 95
  52. td > td

    >
  53. チャンサン
  54. td> td

  55. >
  56. 95

    td> td>

  57. tr > td> 张三 td

  58. >
  59. td>95td>

  60. td >95td >

  61. td>95td>

  62. tr>

  63. tbody>

  64. tfoot>

  65. tr>

  66. td colspan="4">成绩汇总td>

  67. & lt;/tr>

  68. tfoot>

  69. テーブル>

  70. br/>

  71. li>表格適合套の使用三li>

  72. テーブル border="1" ="500" >

  73. caption align="bottom"& gt;学生成绩caption>

  74. col >col>

  75. col bgcolor =blue>col>

  76. >

  77. tr>

  78. 番目>姓名番目>

  79. 番目>语文 th>

  80. th>数学th>

  81. 番目>外语番目>

  82. tr >

  83. >

  84. >

  85. tr >

  86. td >张三td>

  87. td>95 td>

  88. td>95td>

  89. td> 95td> ;

  90. tr>

  91. tr>

  92. td>张三td>

  93. td>95td>

  94. td >95td>

  95. td>95 td>

  96. tr>

  97. tr>

  98. td>张三 td>gt;

  99. td>95td>

  100. td>95 td>

  101. td>95td>

  102. tr>

  103. tbody>

  104. tfoot>

  105. tfoot >

  106. テーブル>

  107. html

  108. >
  109. 上記は、HTML Web ページのテーブルでの構造化タグの適用に関する編集者の簡単な説明の全内容です。誰にとっても役立つでしょう。PHP 中国語 Web サイトをサポートしてください~

    さらに簡単な説明 Html Web ページのテーブルでの構造化タグの適用に関する記事については、PHP 中国語 Web サイトに注目してください。
声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。