html 5:tableテーブルとページレイアウトの整理

3635 ワード
従来のテーブルレイアウトのtableラベルレイアウトのまとめ:
 
既定のスタイル:

 
1.基本表(二重線表)tableラベルにborder属性を追加する:border=“1”、value値は単位を持たない
aa
1
1
bb
2
2
コードは次のとおりです.
border="1" width="100%">
  

    

      aa11
    

    

      bb22

 

2. 无边框表格

aa 1 1
bb 2 2

代码如下：
"100%">
aa11
bb22
 
3.単線表
aa
1
1
bb
2
2
コードは次のとおりです.
border="1"width="100%"style="border-collapse: collapse;">
aa11
bb22
 
 
4.複数列テーブルのマージ
rowspan:行集計数
aa
1
bb
2
cc
3
3
aa
colspan:カラム集計数(特定の長さのセルは、後のセルは削除されません)
1
bb
2
2
2
コードは次のとおりです.
"1"width="100%">
rowspan="2"width="100 px">rowspan:行集計数aa 1
bb2
cc33
"1"width="100%">
aacolspan="2">colspan:列の結合数(特定の長さのセルは、後のセルは削除されません)1
bb"200px">2"200px">22
 
5.すべてのtableラベル表をカバーする
表タイトル:captionラベル
脚注:tfoot
-
-
表体1:tbody
注:tbodyは複数あります
1
2
3
4
表体2:tbody
注意:tbodyは書かないとブラウザでも自動的に生成されます
1
2
3
4
コードは次のとおりです.
"1"width="100%">表タイトル:captionラベル
ヘッダーtheadth 1 th 2
「width:33%」>表体1:tbody「width:33%」>注:tbodyは複数1
234
表体2:tbody注:tbodyを書かないとブラウザでも自動的に1が生成されます
234
脚注:tfoot--
 
6.表の例
会社名
xxx有限会社
証明書の種類
身分証明書
身分証明書
10011***123
情報
catA
br:br:
catB
 
catC
 
catD1
 
catD2
 
catD3
 
catD4
 
コードは次のとおりです.
border="1"width="100%">
会社名「4」>xxx有限会社
証明書タイプ「4」>身分証明書
身分証明書「4」>10011**123
rowspan="5">情報class="label">cata"3">br:br:
catBcolspan="3">
catCcolspan="3">
catD1class="label">catD2
catD3class="label">catD4
 
 
 
転載先:https://www.cnblogs.com/ziChin/p/10165946.html
Polyfillの概要
Uni-appページジャンプ