こんにちは♡
大人可愛いアメブロカスタマイズSHOPのMihoです♪
とってもとっても久しぶりの更新になってしまいましたが、
また記事を少しずつ書いていくのでよろしくお願いします…♪
さて、今回はブログの記事の枠を消す方法についてお伝えします。
久しぶりに自分のブログをカスタマイズしようとPCからブログを見たところ記事の枠がとっても気になったので消してみました。
私のブログは記事の枠色がグレーなので見えづらいのですが、初期は画像の通り記事に枠が設定されています。
記事の枠あり
記事の枠なし
スマホ表示では枠線は関係ないみたいですが、記事の枠を消すとすっきりした印象になります。
それでは早速CSSの編集方法についてお伝えします。
記事の枠を消す方法
１．マイページ ＞ デザインの変更 ＞ CSSの編集画面を表示する。
今回編集する箇所は、CSS編集画面の中盤あたりにある（3－6)記事エリアの箇所です。
border:1px solid #dddddd;となっている箇所の「1px solid #dddddd」を「none」に変更します。
▼実際のCSSは下記の通りです。
/* skinArticle 記事エリア */
.skinArticle{
/* 注 ベースのcssに margin-bottom の記述有り */
padding:16px 0;
border:none;
background:#ffffff;/* ←記事に背景を敷きたいとき */
}
３．表示を確認して枠が消えていたら保存を押して完了です。
保存をする前に必ずプレビューで確認してくださいね。
記事の外枠が消えてすっきり、シンプルな印象になりました。
是非お試しください♪
<< 関連記事 >>
アメブロカスタマイズのための事前準備♡CSS編集用デザインにしましょう！