マーカー本文作成くん

今回はマーカー本文用の使い方とどんなふうにカスタマイズができるか説明していきます。

URL : https://k-editor.com/editor/marker2/

## 基本

マーカー本文用は文字通りマーカーで線を引いたような文章を作るためのものです。シンプルながら目を引く本文を作成できます。デフォルトでは以下のコードが出力されます。

<span style="line-height: 1.5;background:#ffff00;font-size:18px"><span style="color:#000000;font-size:18px;font-weight: bold;">マーカー</span></span>

それぞれの意味は以下の通り。

・line-height：行間

・background:背景色

・font-size: 文字サイズ

・color: 文字色

・font-weight:太字設定

構造としてはシンプルでマーカー本文用の文字をマーカー用のspanに設定して重ねています。

マーカーサイズを大きくするとマーカーの面積が増えます。50%にしたい場合は文字サイズの半分を指定してください。ただマーカーサイズは10pxより小さくはできません。

詳細設定を開くと太字と行間を変更できます。

## テンプレート

デフォルトの設定としていくつか用意しています。上部にあるテンプレから選択すると開発者が適当に設定したものが選べます。

また、カスタムテンプレートの設定の項目で”この設定を保存する”ボタンを押すと現在設定しているものがブラウザに保存されます。

保存した場合、次に同じページを訪問した時にテンプレの選択肢に表示されます。

よく使う色や見出しの種類を作って保存しておくとよいでしょう。

## コード説明

マーカー見出しと異なるのは本文全体にマーカーが引かれることです。外側のマーカーと内側の文字をインライン要素で囲うことで実現しています。こうすることで折り返してもマーカーが引かれます。

本来であればこんな実装の仕方はしなくていいのですが、小説家になろうでは対応していないのでこういった実装をしています。

本文にマーカーを引きたいときにお使いください。

-　-　- ✂切り取り✂ -　-　-

ということで見出しデザイン作成くんの使い方でした。もしよくわからない点などあれば感想などでお知らせください。