グローバルメニューをリニューアルしました。
今回のこだわりポイントは、グローバルメニューの背景設置です。
画像からわかるとおり、ヘッダーより下の部分に背景を設置することでグローバルメニューに背景があるように設定しています。
/* ヘッダーより下部背景設定 */
.skinContentsFrame {
background-image: url(http://stat.blogskin.ameba.jp/blogskin_images/20130306/18/8d/56/j/o00100134makeinfo1362561516297.jpg);
background-repeat: repeat-x;
background-position: center top;
}
アメブロ-スタジオルイスでは下記をcssに追加しています。
repeat-xとcenter topを使っていますので、繰り返しに対応した背景画像を用意する必要があります。
ここでは、このような画像を用意しています。
どこまで縮小しても横に続いていることがわかります。
今までよりちょっと違うアメブロカスタマイズ実現してみませんか？