記事欄 & サイドバー枠の角を丸くしたい!
ついでに、枠に影もつけたい!
そんなカスタマイズの方法についてのお話しデス。
記事欄の角を丸くする & 影をつける
/* 記事欄に背景色と影*/ .entry-inner { background-color:#EDE1D6; padding:5px; -moz-box-shadow: 1px 3px 7px 2px #928178; -webkit-box-shadow: 1px 3px 7px 2px #928178; box-shadow: 1px 3px 7px 2px #928178; /* 記事欄枠に影*/ border-radius: 10px;/* 記事欄枠の角を丸くする*/ }
上記のコードを デザイン ▶ カスタマイズ ▶ 「CSS」に貼り付けます。
box-shadow: 1px 3px 7px 2px #928178; /* 記事欄枠に影*/
box-shadow の px 数値を変更すれば、影の 幅 を変更できます。
#の数値を変更すれば、影の 色 を変更できます。
border-radius: 10px;/* 記事欄枠の角を丸くする*/
border-radius は 角を丸くしてくれます。
px 数値を変更することで、角の丸み 具合を変更できます。
サイドバー枠の角を丸くする & 影をつける
/* サイドバーに背景色と影 */
#box2-inner {
background-color:#EDE1D6;
padding:5px;
-moz-box-shadow: 1px 3px 7px 2px #928178;
-webkit-box-shadow: 1px 3px 7px 2px #928178;
box-shadow: 1px 3px 7px 2px #928178;/* サイドバーに影*/
border-radius: 10px;/* サイドバーの角を丸くする*/
}
上記のコードを デザイン ▶ カスタマイズ ▶ 「CSS」に貼り付けます。
box-shadow: 1px 3px 7px 2px #928178;/* サイドバーに影*/
box-shadow の px 数値を変更すれば、影の 幅 を変更できます。
# の数値を変更すれば、影の 色 を変更できます。
border-radius: 10px;/* サイドバーの角を丸くする*/
border-radius は 角を丸くしてくれます。
px 数値を変更することで、角の丸み 具合を変更できます。
角が丸くなって優しい雰囲気になりました!((( *´꒳`* ))) ポワワーン
カラーコードは、▼・ェ・▼にっき。では毎度お馴染みのコチラ ↓
和色大辞典さまデス!
柔らかい印象の色がたくさんあるよ♪٩(ˊᗜˋ*)و
いつもお世話になっております!
ってところで、今日はおしまいデス!
゚*。.ღ ⊹⊱ £ονё & βLёss уoц ⊰⊹ ღ.。*゚
Thank you.
I love you.