賢威7.0クール版 投稿記事のH4タグ文字色・背景色・枠線変更方法

どうもスイクンです。サイトをご覧頂きありがとうございます。 今回は賢威7.0クール版の「H4タグ文字色・背景色・枠線変更方法」をご紹介します。

H4タグ部分文字色変更方法

変更前 2016y02m05d_005742729 変更後 文字色を赤色にしました。 2016y02m05d_010126549 賢威7.0クール版では、外観>テーマ編集>base.cssの以下の部分コードが関係しています。
.main-body h4{ margin: 55px 0 25px; font-weight: bold; font-size: 1.25em; position: relative; padding: .1em 0 .2em .75em; border-left: 6px solid #006a6c; }
太文字を追加します。
.main-body h4{ margin: 55px 0 25px; font-weight: bold; font-size: 1.25em; position: relative; padding: .1em 0 .2em .75em; border-left: 6px solid #006a6c; color: #f00; }

H4タグ部分背景色変更方法

変更前 2016y02m05d_005742729 変更後 2016y02m05d_010300738 賢威7.0クール版では、外観>テーマ編集>base.cssの以下の部分コードが関係しています。
.main-body h4{ margin: 55px 0 25px; font-weight: bold; font-size: 1.25em; position: relative; padding: .1em 0 .2em .75em; border-left: 6px solid #006a6c; }
太文字を追加します。
.main-body h4{ margin: 55px 0 25px; font-weight: bold; font-size: 1.25em; position: relative; padding: .1em 0 .2em .75em; border-left: 6px solid #006a6c; background: #d4e3e3; }

H4タグ部分枠線変更方法

変更前 2016y02m05d_005742729 変更後 2016y02m05d_010501122 賢威7.0クール版では、外観>テーマ編集>base.cssの以下の部分コードが関係しています。
.main-body h4{ margin: 55px 0 25px; font-weight: bold; font-size: 1.25em; position: relative; padding: .1em 0 .2em .75em; border-left: 6px solid #006a6c; }
参考
  • borderで線を挿入することを意味しています。
  • solidは実線です。他にも、double(二重線)やdottedなどもあります。
  • 6pxの部分は、線の太さを示しています。
  • #006a6cは線の色を意味しています。カラーコードを使います。
  • これらの組み合わせで好きなように枠線を変更可能です。
  • また、border-top;のように指定すると、上だけに枠線がひかさるようになります。
    • border-left;
    • border-right;
    • border-bottom;
    • などもあります。
以上でH4タグのカスタマイズ説明は終わりです。

コメントを残す

メールアドレスが公開されることはありません。