Webふぉれすと
Web制作、Webデザインのスキルアップに役立つ情報をお届けします!
みんなが癒され、元気になるWebを目指します。
サイトマップはこちら
PI-chicc,PA-chicc
うぇぶ実験室
ふぉれすとCafe
NANAKORO*BEANS
くりっくりんく
イベント・セミナーを探せ!
ふぉれすとかわらばん
がしがし通信
今日のスタッフ
スタッフプロフィール
ご意見ご感想フォーム
トップページにもどる
Webふぉれすとトップ > うぇぶ実験室

今月の実験:スペーサーイメージを使おう

小さいのに大きな役割のスペーサー。
どんな使い方があるのでしょうか
スペーサーを使おう
【実験内容】
スペーサーイメージを使ってレイアウトしてみよう
【画像の選定】
スペーサーイメージは1ピクセルの透過GIFとする
【実験条件】
Dreamweaver/Fireworksを使用する
【実験担当者】
あんまま
【スペーサーイメージとは?】

1×1ピクセルの透明 GIFで保存

「スペーサーイメージ」とは、1×1ピクセルの透過GIFで、 「スペーサーgif」や「スペーサー」と略して呼ばれる時もあります。スペーサーをうまく利用することで、スタイルシートに対応していない古いブラウザでも、細かいレイアウトが可能になります。

今回は実験本文では「スペーサー」で統一します。

スペーサーを使うメリットは
 ・ピクセル単位のインデント
 ・ピクセル単位のマージン
 ・テーブルのセルサイズの維持
が簡単にできることです。

【スペーサーイメージをつくる】

まずはFireworksでスペーサーを作ってみましょう!

「新規ドキュメント」でキャンパスサイズを幅1ピクセル・高さ1ピクセルとして、キャンパスカラーを「透明」とします。
次にその画像を、そのまま透過GIFとして保存します。右の○の中にあるスペーサーイメージは 1600%まで拡大したものです。

現物の大きさは→スペーサー←このやじるしの間に入ってます(笑)

では実験に入ってみましょう!


うぇぶ実験室トップ
続きを読む

Copyright(c)2002-2004 Step-First All rights reserved. [About WebForest]
E-Mail:webforest@step-first.com