MENU

アメブロ メッセージボードの背景色を変更

2020 7/02

今回は、アメブロのメッセージボードの背景色を変更してみます。

メッセージボードはアメブロの中でも目立つ部分ですので、背景の色をみながら調節してみましょう。

目次

アメブロ メッセージボードの背景色を変更する方法

メッセージボードのカスタマイズを設定する前に、カスタマイズができるようにこちらの設定にしておきましょう。

基本設定は、こちらです。
アメブロカスタマイズをする際の基本手順

現在使用中のブログデザインCSSの下までスクロールします。

メッセージボード基本のカスタマイズ

デフォルトでは、上記のように記載されていますので、↓下記↓に変更してみます。

カスタマイズ後

背景色がうすいレモン色になりました。

メッセージボード囲み線と背景色を付ける

直線のオレンジの囲み線を入れる設定にしてみました。

カスタマイズ後

こんな感じで、薄水色のメッセージボードと枠ができます。(画像だとわかりにくいですが、枠は二重線になっています)

おまけ

線の種類
  • dotted…ドット
  • solid…直線
  • dashed…破線
  • double…二重線

border:2px solid #ffdab9; のborder:2px dashed #ffdab9; に変更すると破線になります。

線のデザインを変えてお試しください。

アメブロのデザインテンプレートを販売中です。全体のデザインを統一していますので、チェックしてみてくださいね

この記事が気に入ったら
フォローしてね!

この記事を書いた人

メール対応・資料作成・Webサイト管理・SNS運用・ライティング・デザインまでワンストップ対応できるクリエイティブ秘書&ブロガー。

ブログは、フリーランスお仕事系お役立ち記事を載せています。
お仕事依頼はこちらから

目次
閉じる