背景画像をいじってみました。

以前からやってみたかった、背景画像の追加を、Vicunaさんのサイトを参考にやってみました。

»

 Forum » mt.Vicuna » 背景画像の透過について

方法は簡単。私はVicuna CSSのStyle SmartCanvasを使っているのですが、1-elements中の記載にある、Body文を変更するだけ。

背景画像については、PHPSPOTの記事「デザイナーが知っておくべき背景画像のリソースサイト集」を参照し、Shizooさんのものを使わせてもらいました。素敵なグラフィックをが沢山ありましたので、ちょっと迷いましたが、鎌倉チックに緑色。

 

Shizooさんのグラフィックから、いくつかピックアップしてみました。センスいいです～

あと、 「和風素材の篆刻（てんこく）素材AOI」さんにも、和モダン？なグラフィックが多く有ります。オススメです。

 

本当は、ブログ記事やサイドバーも透過させたいのですが、フォント色との調整が発生しそうだし、各モジュールごとにいじる必要がありそうなので、今日はとりあえず良し。

＜変更前＞

で、、

＜変更後＞

 

＜自分メモ： 普通のスタイルシートで背景画像を変更する場合＞

◎ 背景色（画像）変更方法
以下のスタイルシート（CSS）の赤字部分を変更。
■ ブログ全体の背景色を変更する場合
body {
background-color : #123456;
}
■ ブログ全体の背景画像を変更する場合
body {
background : #123456 url("画像へのパス（URL）");
}
※備考； "#123456" は、背景画像が表示されない時に表示する色を指定
▼ 背景画像の位置を指定する場合
body {
background : #123456 url("画像へのパス（URL）") no-repeat fixed 50% 30%;
}
※「no-repeat fixed 50% 30%」を追加 （”50% 30%”は、縦、横の配置位置の割合）
▼ 背景画像を固定する場合
body {
background : #123456 url("画像へのパス（URL）") fixed;
}
※「fixed」を追加

多少なりとも雰囲気が出てきました。少しずつ、少しずつ。

Hatena タグ: MT4,背景画像

↓↓↓応援のクリック、宜しくお願いします! ↓↓↓