はじめに
今回は記事内に見出しを設置して読者様の読みやすさを向上させる方法です。見出しとはメインに記事タイトルがあり、その中にサブタイトル的な役目をしていると言えるでしょう。
それだけではなく、読者様は「ここから内容が変わるのか」、「次のステップに移行するのか」と頭の中が整理されることになり、理解力も上がりますので是非取り入れて下さい。
画像の赤枠の部分の箇所です。
記事内見出し設置手順
①HTMLを文章の見出しにしたい箇所に記入です。②手順はコピペでCSS編集画面にて「CSSの追記」です。
※↑順番どちらでもOK。
①下記HTMLを記事編集画面にてコピペ。
※「HTMLタグを表示」で編集して下さい。
/* ▼▼見出しここから▼▼ */
<h4 class="h6">ここに見出し文章</h4>
/* ▲▲見出しここまで▲▲ */
<h4 class="h6">ここに見出し文章</h4>
/* ▲▲見出しここまで▲▲ */
「見出し例1」ここにテキスト
②下記CSSをCSS編集画面にて最下部の
「 (4) その他、拡張・/* その他、拡張があれば記述 */」の下にコピペ。
※カラー、サイズなどは説明を参考に変更して下さい。
/* ▼▼見出し例1ここから▼▼ */
.h6{
padding:12px 10px;
border-left:5px solid #1871B8; /*左ライン太さ・色*/
background:#1D8ADE; /*テキスト背景色*/
color:#FFFFFF; /*テキスト色*/
}
/* ▲▲見出し例1ここまで▲▲ */
.h6{
padding:12px 10px;
border-left:5px solid #1871B8; /*左ライン太さ・色*/
background:#1D8ADE; /*テキスト背景色*/
color:#FFFFFF; /*テキスト色*/
}
/* ▲▲見出し例1ここまで▲▲ */