サイドバーウィジェットの見出しに枠をつける方法


WordPress管理画面から「外観 ⇒ テーマの編集」⇒「base.css」


「base.css」内で以下のコードを探します。


.sub-conts .section-wrap .section-in .section-title,
.sub-conts .section-wrap .article-header .section-title{
margin: 0 -20px 30px;
padding: 0 0 11px;
border-bottom: 1px solid #ccc;

font-weight: normal;
font-size: 1.125em;
}




.sub-conts .section-wrap .section-in .section-title,
.sub-conts .section-wrap .article-header .section-title{
margin: 0 -20px 30px;
padding: 11px 11px;
border: 1px solid #ccc;

font-weight: normal;
font-size: 1.125em;
}




サイドバーウィジェットの見出しに枠の変更前

saidoba-midasiwaku (1)


サイドバーウィジェットの見出しに枠の変更後

saidoba-midasiwaku (2)

「border: 5px」の数値を5pxに変更する事で線を太くできます。


.sub-conts .section-wrap .section-in .section-title,
.sub-conts .section-wrap .article-header .section-title{
margin: 0 -20px 30px;
padding: 11px 11px;
border: 5px solid #ccc;

font-weight: normal;
font-size: 1.125em;
}


「border: 5px」に変更後

saidoba-midasiwaku (3)




「border」のみにすると、上下左右に枠線がつきます。

一方向のみに枠線をつけたい場合は、コードを以下に変更します。


上だけに枠線を付ける「border-top」
下だけに枠線を付ける「border-bottom」
右だけに枠線を付ける「border-right」
左だけに枠線を付ける「border-left」



参照:賢威7カスタマイズまとめ一覧