アメブロカスタマイズ♡CSS編集でメッセージボードに背景色をつけて可愛く目立たせる♡ | 大人可愛いアメブロカスタマイズ|ブログのはじめ方|S W E E T

大人可愛いアメブロカスタマイズ|ブログのはじめ方|S W E E T

アメブロ初心者の方でも簡単にカスタマイズ出来ます♡初心者さんへブログの書き方やコツ、可愛いデザインのご提供♡
アクセスアップして集客出来る、売れるブログ作り♡

こんにちは♡
いきなりですが 笑

先日出席したお友達の結婚式でブーケをとりました♡

きっと来年は~。。。♡笑


今回は、CSS編集用デザインで
アメブロのメッセージボードに背景色をつけるカスタマイズです♡

背景色をつけるだけで目立つしとっても可愛くなります♡

りぼん CSS編集用デザインについて・設定方法はこちらで確認してください→♡♡♡


メッセージボードとは画像のピンクの枠の部分!




ブログタイトル(ヘッダー画像)の下・記事の上に表示されるスペースです。

メッセージボード自体はすべてのデザインのブログで使用できます。

ただ、カスタマイズ可能なスキン(CSS 編集用デザイン)だと初期はすごぉく
シンプルであまり目立ちません。


いろいろとカスタマイズの方法はありますが、簡単にすぐできる方法として
背景色をつける方法をご紹介しますね♡


1 マイページ > アメブロ > デザインの変更 > CSSの編集


2 現在使用中のブログデザインCSS編集画面を
(3ー5)メッセージボード部分までスクロール

4 background:#ffffff;/* ←メッセージボードに背景を敷きたいとき */

ピンク色部分#~に好きなカラーコードを入力する




5 表示を確認する → 保存


ちなみにいつもの?ピンク色のカラーコードを指定すると




こんな感じになります

このままだとメッセージボードの上下に黒の点線がついたままになっています。



りぼん メッセージボード上下の黒の点線を消す


上下の黒い点線を消したい場合は、

1 下記2行を削除する↓

border-top:1px dotted #979797;
border-bottom:1px dotted #979797;



2 border:none;/*線を消す*/ を追加する





背景色は白のままで線だけ消したい場合も上記のようにしてくださいね

すると上下の線がなくなります。

ちょっと画像が見えにくくてごめんなさい;





メッセージボードをいろいろな色に変えるだけで

目立ちますので試してみてくださいね963