見出し、区切り線等の変更

Simplicity2はそのままでも素敵な見出しですが、ちょっとシンプルすぎるので加工しました。
以前『Gush2』で採用していた見出しを丸ごと持って来ました。

見出し2

見出し3

見出し4

下が区切り線です。

---

下の枠内が「追加CSS」(または子テーマの『style.css』)に追加するタグです。
<pre>〜〜〜</pre>のデモをかねています。
padding と margin にマーカーしています。(参照：padding と margin)
/* ピンクマーカー */ の説明を参考に見出し加工にチャレンジしてみてください。

/*--------------------------------------
見出し
--------------------------------------*/
.article h2 {
	background: #dcdcdc;   /* 背景色 */
	border-bottom: 2px solid #696969;   /* 下線の太さと色 */
	border-left: 5px solid #333333;   /* 左の線の太さと色 */
	text-align: left;   /* テキスト左寄せ */
}

.article h3 {
	font-size: 20px;   /* テキストの文字サイズ */
	text-align: left;   /* テキスト左寄せ */
	background: #dcdcdc;   /* 背景色 */
	border-bottom: 2px solid #696969;   /* 下線の太さと色 */
	border-left: 5px solid #333333;   /* 左の線の太さと色 */
	margin: 10px 5px;
	padding: 10px 5px;
	color: #333333;   /* テキストの文字色 */
}

.article h4 {
	font-size: 18px;   /* テキストの文字サイズ */
	text-align: left;   /* テキスト左寄せ */
	background: #ffffff;   /* 背景色 */
	border-bottom: 2px solid #696969;   /* 下線の太さと色 */
	border-left: 10px solid #696969;   /* 左の線の太さと色 */
	margin: 10px 5px;
	padding: 5px 10px;
	color: #333333;   /* テキストの文字色 */
}

/*--------------------------------------
区切り線
--------------------------------------*/
hr {
  display: block;
  width: 100%;
  height: 2px;   /* 線の太さ */
  background-color: #696969;   /* 線の色 */
  border: 0;  /*デフォルトデザインでは線がある場合があるので、消しておく*/
}

/*--------------------------------------
pre（cssやphpのタグをそのまま表記）
--------------------------------------*/
pre {
  background-color:#f5f5f5;   /* 背景色 */
  border:1px solid #696969;   /* 枠線の太さと色 */
  padding: 7px;
  overflow: auto;
}

※『pre』は、ハイライト表示をオンにしている場合は枠線の色しか反映されません。