1ピクセルJPEG
1ドットGIFというページを10年ほど前に作りました。
Web関連の勉強にあたり、久しぶりに高さ1ピクセルの画像を作ってみました。
CSSレイアウトの練習時、自由な大きさに表示できる、便利な画像です。
ファイルサイズが小さいのもすてき。いずれも、約1.4キロバイトです。
- 使用例：
- <img src="1px.jpg" width="500" height="200" />
- background: url("1px.gif") repeat;
| 実寸(200px×1px) | 150×200で表示 | 250×100で表示 |
|---|---|---|
 |
|
|
 |
|
|
 |
|
|
作り方（たとえばPhotoshopで）
- （新規ダイアログボックスで）幅200px、高さ1px、解像度72ppi
- （300%程度に拡大表示）
- グラデーションツールを選択
- オプションパネルの[クリックでグラデーションを編集]をクリックし、グラデーションを編集
- Shiftキーを押さえながら水平方向にドラッグ
- Webおよびデバイス用に保存
- ＜Jpeg 最高画質＞で保存