HTML4.1からHTML5.0では廃止（非推奨）となっているtable要素の属性を修正する‐HTML・CSSを学ぶ

table要素の属性を修正する

 table要素の中には数多くの属性が記述されています。前回でも取り上げましたが、HTML4.1で作成されたホームページのHTMLを一度に修復することはHTML5の知識が乏しい私にとっては難しい問題です。

前回の投稿は下記のリンクです。

HTML4.1で作成したホームページのHTMLでHTML5.0では廃止（非推奨）となっているタグ要素を修正する‐HTML・CSSを学ぶ

実際、少しずつでも修復できたらとの思いで取り掛かったもののなかなか作業が進みません。考えが甘かったのかな(笑)。それでも、なぜか隙間時間を見つけては毎日机に向かいHTMLと向かい合っています。

table要素に装飾を施す属性が付加されているのですが、その属性をCSSに記述していきます。只それだけなのですがHTML５の知識が中途半端な上、一度覚えたつもりの要素や記述方法をなかなか覚えられないことも影響して要領を得ません(~_~;)。

年は取りたくないものです(笑)。

属性をスタイルシートstyle.cssに記述、追加

今回は下記の部分について編集していきます。

<table width="100%" border="0" cellspacing="0" cellpadding="0" class="table01">

この中から「width="100%" border="0" cellspacing="0" cellpadding="0"」が廃止（非推奨）となっています。ほとんどですね(笑)。

上記属性を既存のスタイルシートstyle.cssに記述、追加していきます。

CSSとHTMLの記述方法

CSS

.table01{

background-color: #ffffff;

margin-top: 0px;

margin-right: 2px;

margin-bottom: 7px;

margin-left: 2px;

padding-top: 3px;

padding-right: 2px;

padding-bottom: 0px;

padding-left: 2px;

width: 100%;

}

HTML

<table class="table01">

属性を修正後のホームページの表示です。フレーム表示部分を表示しています。

既存のスタイルシートが適用（style.cssのclass="table01"）されていますので、そのスタイルシートに追加、もしくは一部のプロパティを追加することでHTML5に対応したものに編集できます。