2011年07月28日

背景画像を左側にいれました

背景画像を左側にいれました。画面全体が白っぽいので見た目を修正したいためです。
  1. 城壁の写真を撮影
  2. PhotoshopElementsで画像をあらかじめリサイズして小さく
  3. トリミングして、境界線をぼかし、明るさとコントラストを調整し、全体を淡く
  4. ウェブ用に保存で、ジフ画像に変換して保存、大きさは左右336pxに
  5. 画像をブログにアップロード
  6. ブログのCSS編集でbodyにbackground-imageを指定、以下7.のようになります
  7. body {
    background-image:url("http://gusuku365.up.seesaa.net/image/gusuku365.gif");
    background-position:top left;
    background-repeat:no-repeat;
    background-attachment:fixed;
    background-color:#FFF; 以下略
  8. 実際に見えている画像は半分くらい、読み込み中にときどき全体が見えることがあるのがちょっと面白い
画像全体はこうなっています。大隅の城壁のカーブしている部分を下から見上げて撮影したもの。背景画像なので、できるだけ容量を少なくするようにします。
大きなディスプレイ画面で見ている方は、背景画像の下端が直線的に見えるので少し違和感があるかもしれません。次回修正します。
gusuku365.gif
タグ:背景画像
【関連する記事】
posted by gusukutarou at 19:17| Comment(0) | TrackBack(0) | レイアウトについて | このブログの読者になる | 更新情報をチェックする
この記事へのコメント
コメントを書く
お名前: [必須入力]

メールアドレス: [必須入力]

ホームページアドレス: [必須入力]

コメント: [必須入力]

認証コード: [必須入力]


※画像の中の文字を半角で入力してください。
※ブログオーナーが承認したコメントのみ表示されます。
この記事へのトラックバックURL
http://blog.seesaa.jp/tb/217187028
※ブログオーナーが承認したトラックバックのみ表示されます。
※言及リンクのないトラックバックは受信されません。

この記事へのトラックバック
×

この広告は1年以上新しい記事の投稿がないブログに表示されております。