見出しを飾りたい場合、検索するといろんな例が出ています。
コードも表示されていて、「コピペして使ってください」などと大変ありがたいブログもあります。
ワードプレスでブログを作成している方に、
利用したい見出しのコードをコピーして利用する方法を説明します。
(コピー可の表示がない場合は安易にコピーして使用してはいけません)
CSSにコードをコピーする手順
よく使われている見出しですが、次のように飾りたいと思います。
検索すると
「次のようにコードをコピペして使ってください」とあり、b1という名前でコードが示されています。
b1 {
padding: 0.25em 0.5em;/*上下 左右の余白*/
color: #494949;/*文字色*/
background: transparent;/*背景透明に*/
border-left: solid 5px #7db4e6;/*左線*/
}
① まず、コードをコピーして下さい。
② ダッシュボードの「外観」ー「カスタマイズ」をクリック。
③ 「追加CSS」をクリック。
④ コピーしたCSSコードを張り付けます。
⑤ 投稿画面に戻って「テキスト」の画面で次のように入力してください。
<b1> 提出先の確認 </b1>
”b1 ”はさきほどコピーしたCSSの名前です。
”提出先の確認” は見出しの文字です。
見出しの文字を大きくしたい場合は、次のように文字を大きくするコードを<b1> </b1>で挟めばOKです。
<b1><strong><span style=”font-size: 18pt;”>提出先の確認</span></strong></b1>
これで終了です。