今回は６０回目です。
表の上にタイトルを重ねます。

タイトルを表に重ねる
今回の効果はＴＡＢＬＥで作った表の上に、四角で囲ったタイトルを重ねるというものです。
１９９９年１２月の「オブジェクトの重ね合わせ」に似ています。あの時と同じような書き方でＴＥＢＬＥタグの中で位置の指定をします。
Ｔａｂｌｅタグの中にちょっと指定を加えるだけでいいので、手軽にできるのではないかと思います。
今月も少しだけこの実験にお付き合い下さい。

ポイント ポイント まず、タイトル用の小さいテーブルと内容を入れる大きいテーブルの二つを書きます。
ＴＡＢＬＥタグの中に STYLE= で指定をします。
z-index:0 はどのような順番で重ねるかです。数字が小さい方が下になります。
top:122 は、上からの位置をピクセルで指定します。
left:130 は、画面左からの位置をピクセルで指定します。
font-size:16 は文字の大きさ、border-color:#ff8888 はテーブルの枠の色、border-style:solid は枠を１本線で表示するスタイルの指定、border-width:1px は枠の幅（太さ）、background-color:#ffe9e9 はテーブルの背景の色を指定しています。
text-align:center は、文字をセンターに寄せるという指定です。
効果 効果 各ＴＡＢＬＥタグの中で指定した内容に従ってテーブルが表示されることによって、二つのテーブルが重なり、タイトルが表の枠の上に乗って見えます。
使い方 使い方 実際の実験画面のソースをご覧下さい。

今回の実験でわかったこと

この効果はＩＥの６.０と、ネットスケープの７.０で確認しています。
Ｍａｃは確認していません。

１９９９年１２月の実験では、画像やテキストを重ねましたが、今回はテーブルごと重ねてしまうというやり方です。
効果としては地味ですが、普通のテーブルではできないことですので、ちょっといいかもしれません。


ご意見などありましたらメールを送って下さい。お待ちしています。
(E-mail:hiroko@ladys-page.com)
超簡単ＨＰ実験室 実験室のトップページに