原稿用紙風割烹作成くん（横）

今回は原稿用紙風割烹(横)の使い方とどんなふうにカスタマイズができるか説明していきます。

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

## 基本

原稿用紙風割烹は文字通り原稿用紙風の割烹を作成するための物です。原稿用紙っぽい割烹を作りたいときにお使いください。デフォルトでは以下のコードが出力されます。

<div style="color:#333;background-color:#fff;font-size:18px;padding-left:5px;padding-top:5px;line-height:40px;background-image:url(https://22980.mitemin.net/userpageimage/viewimage/icode/i495309/);background-repeat:repeat;letter-spacing:10px;font-family: 'Noto Sans Japanese', 'メイリオ', Meiryo,'Lucida Grande', sans-serif;"></div>

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

・color: 文字色

・background:背景色

・font-size: 文字サイズ

・padding：内余白

・line-height：行間

・background-image：背景画像

・letter-spacing:文字間幅

・font-family:フォント

こんな風に活動報告で表示されます。

注意点は半角文字を使うとずれることです。基本的に全角文字だけ使ってください。なお、文字サイズや文字間隔、行間などを完全固定しているので指定以外のサイズの要素を入れるとずれます。

できるだけ単品でお使いください。

## コード説明

background-image:url(https://22980.mitemin.net/userpageimage/viewimage/icode/i495309/);の元はこれです。

小さくて見えにくいかもしれませんが、原稿用紙の一マスです。これをrepeatさせて背景画像として設定しています。

普通であればlinear-gradientなどを使って原稿用紙を作成できるのですが、小説家になろうの割烹では対応していないので苦肉の策を使ってます。力技です。

もしこれ以外のサイズや行間にしたい場合は同じように一マス分のテンプレート画像を作成して行間、文字サイズ、文字間距離を調整しましょう。

指定はpxが便利です。emを使っても正直背景画像サイズに引っ張られるので意味ないです。

またフォントは等幅フォントを指定してください。端末によってずれます。とくにiOS。なろうの指定だとデフォルトでは等幅フォントではないので書き換えないとずれます。

リンクを貼ったり色を変えたりするときは文字サイズ、行間指定は行わないようにしましょう。

割烹エディターでは文字サイズ情報など含まれることがほとんどなので貼り付け時にその情報を消す、またはサイズを18pxにしてください。

基本的に変わり種は単品で使うことを想定していますので、他と組み合わせる場合は注意が必要です。

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

ということで原稿用紙風割烹作成くん（横）の使い方でした。もしよくわからない点などあれば感想などでお知らせください。