こんにちは、カスタマイズと復興支援で頑張るたっくんです。


突然ですが、あなたに質問です。


現在、当ブログ内に背景画像は何枚使用されていると思いますか?


記事背景画像は、カウントしないでください。


あくまでも、ブログの背景画像です。





正解は、3枚です。


1枚目は、言うまでもなく緑のチェック画像です。


2枚目は、左側に表示されているこちら、


高田松原の「奇跡の一本松」です。


カスタマイズと復興支援で頑張るたっくんのブログ



そして3枚目ですが・・・


もしかして、ご存じない方もいらっしゃるかもしれませんね。


これは、1番下までスクロールしないと出現しません(笑)



カスタマイズと復興支援で頑張るたっくんのブログ

「東北の海」です。


もう少しタイトル考えればよかった(笑)


というわけで、


新デザインでは、このように複数の画像を背景に設定できます。


イメージとしては、背景画像を重ねるって感じかな?


確か、あと1枚設定できたはず・・・


ほかにも、把握していませんが、


いろんなところに画像を設定できるみたいです。


お気に入りの画像が用意できたら、


ぜひチャレンジしてみてください。


あなたのアイデアと工夫次第で、無限の可能性が広がると思います。


注:新CSS編集デザイン用のカスタマイズです。


ちなみに・・・


body(一番下の層)

.skinBody(下から2番目の層)

.skinBody2(下から3番目の層)

.skinBody3(下から4番目の層)


なのですが、


body 使用していません。


.skinBodyが一番下の層となっております。(チェック画像使用)


/*背景下から2枚目(東北の海)*/
.skinBody2{
background-image:url(画像URL);/*背景画像*/
background-position: 50% 100%;/*中央下*/
background-repeat:no-repeat;/*繰り返さない*/
}


/*背景下から3枚目(一本松)*/
.skinBody3{
background-image:url(画像URL);/*背景画像*/
background-position: 0% 70%;/*左端上から70%*/
background-repeat:no-repeat;/*繰り返さない*/
background-attachment:fixed;/*スクロールしても位置固定*/
}

なお、今回もまた、


いつもお世話になっています、実験委員さんの記事を参考にしました。


ありがとうございます。


今回は、かなり参考にさせていただきました。


あなたも、ぜひ参考にしてみてください。


CSS 背景3