1. ホーム
  2. Web制作
  3. HTML/Xhtml

HTMLのテーブル表のframe属性とrule属性の説明

2022-01-09 13:18:59
のframe属性とrules属性があります。

tableタグのframe属性とrules属性は、ボーダーの表示を制御します。frameはテーブルの一番外側の4つのボーダーの見え方を制御し、rulesはテーブルの内側のボーダーの見え方を制御します。 また
frame属性の望ましい値と意味は以下の通りです。
* void - デフォルト値です。フォームの一番外側のボーダーを表示しないことを示す。
* ボックス - 4つのボーダーを同時に表示します。
* ボーダー - 4つのボーダーを同時に表示します。
* 上記 - 一番上のボーダーのみを表示します。
* 下 - 下部のボーダーのみが表示されます。 {下枠のみ表示
* lhs - 左側のボーダーのみを表示します。
* rhs - 右のボーダーのみを表示します。
* hsides - 2つの水平ボーダーのみを表示します。
* vsides - ボーダーの垂直方向の2辺のみを表示します。
rulesプロパティは5つの値を取ることができます。
* none - デフォルト値です。ボーダーなし。
* グループ - 行または列のグループにボーダーを追加します。
* rows - 行にボーダーを追加します。
* cols - 列にボーダーを追加します。
* all - すべての行(セル)にボーダーを追加します。


コード例です。

XML/HTMLコード コンテンツをクリップボードにコピーする
  1. < テーブル ボーダー = "1" = "600" フレーム = "hsides" ルール = "グループ" >
  2. < キャプション > マイ・アルティメット・テーブル < キャプション >
  3. < コルグループ スパン = "1" = "200" > < コルグループ >
  4. < コルグループ スパン = "3" = "400" > < コルグループ >
  5. < テード >
  6. < tr >
  7. < td > セル1-1 < td >
  8. < td > セル1-2 < td >
  9. < td > セル1-3 < td >
  10. < td > セル1-4 < td >
  11. < tr >
  12. < テード >
  13. < >
  14. < tr >
  15. < td > セル4-1 < td >
  16. < td > セル4-2 < td >
  17. < td > セル4-3 < td >
  18. < td > セル4-4 < td >
  19. < tr >
  20. < >
  21. < 本体 >
  22. < tr >
  23. < td > セル2-1 < td >
  24. < td > セル2-2 < td >
  25. < td > セル2-3 < td >
  26. < td > セル2-4 < td >
  27. < tr >
  28. < tr >
  29. < td > セル3-1 < td >
  30. < td > セル3-2 < td >
  31. < td > セル3-3 < td >
  32. < td > セル3-4 < td >
  33. < tr >
  34. < 本体 >
  35. < テーブル >

ブラウザでの表示はこのようになります。