NO.18 テーブル作成E

HTMLタグレベルのテーブル解説最終回。今回は他のHTML講座では到底扱わないような応用法を紹介します。
まずセルの一つ一つにサイズ・背景色をつけるのが可能な事は分かったと思います。
もしもセルのサイズを一番小さくして、一つずつ色をつけていったら・・・
何と画像ファイルに代用させる事が出来ます。
画像ファイルを貼らずに画像を表現する事が出来るのです。
能書きはこれくらいにして、実際に試してみましょう。



どうでしょうか?物凄く無駄な行為にも思えますが、JavaScriptでソースを軽減すればそれなりに軽くなります。
表示にちょっと時間がかかるのが難点ですが、小さなものなら余裕で変換できますね。
前に画像ファイルをテーブルタグに変換するソフトを作りましたが、いろいろやってみると面白いですよ。
素でやってしまうととても重いので、JavaScriptを使って写真ファイルを変換してみると、
こんな風になります。
このテーブルタグでの画像表現(テーブルアート)の利点は、同じ物を拡大したり横に伸ばしたりといった作業が容易(?)に出来る事です。
さすがに重いので、これ以後ソースは表示しないで解説します。ソース見るときは普通にページ右クリック⇒ソースの表示を見てください。
上のテーブルを5倍に拡大してみました。



文字を入れる事も出来ます。



意図的に画質(?)を落とすのも可能なので、モザイク状態にすることも出来ます。



まぁ・・実用性こそ皆無ですが、たまにはこういうのもやってみると面白いですよ。

前に戻る 次に進む
SEO [PR] 爆速!無料ブログ 無料ホームページ開設 無料ライブ放送