ＣＳＳを使った基本デザイン

WordPerss > Photo Gallery

０５　画像のデザイン

画像を表示することで、Ｗｅｂがぱっと楽しい雰囲気になります。
画像の作成にはグラフィックソフトを使います。
ここでは、Ｗｅｂページで画像を利用する方法です。

ＣＯＮＴＥＮＴＳ　※ブラウザのソースで確認してください

（１）画像つくりに必要なものを用意する
- ･ﾌｧｲﾙなし
（２）Ｗｅｂページに画像を表示する　<img/>　
- ･画像を表示
（３）タイトル画像を作成する　<img/>
- ･タイトル画像に置換え
（４）背景に画像を表示する　background-image
- ･ページの背景に画像を表示
（５）行頭にマークを表示する　background-(image,repeat,position),padding-left
- ･中見出しの行頭に背景画像として表示
（６）文章の中に画像をレイアウトする　float,clear,margin-left,margin-bottom
- ･文章と画像を左右に並べてレイアウト
（７）一部の画像のレイアウトを変更する　float,margin-right,margin-bottom
- ･画像の１枚だけを左に表示