h1はこれです

h2はこれです

h2はこれです

h3はこれです

h4はこれです

h5はこれです

h6はこれです

あかのアンダー黄色のマーカー黄色のアンダーマーカーバッジ

細く説明１

細く説明？

プライマリー

さくせす

インフォ

ウォーニング

デンジャー


<span class="red-under">あかのアンダー</span>
<span class="marker">黄色のマーカー</span>
<span class="marker-under">黄色のアンダーマーカー</span>
<span class="ref">バッジ</span>
<div class="information">細く説明１</div>
<div class="question">細く説明？</div>
<div class="sp-primary">プライマリー</div>
<div class="sp-success">さくせす</div>
<div class="sp-info">インフォ</div>
<div class="sp-warning">ウォーニング</div>
<div class="sp-danger">デンジャー</div>

HTMLエスケープを行うには、以下のウェブツールなどを利用してみてください

HTMLエスケープツール | Web制作小物ツール - dounokouno.com

HTML Escape / Unescape

テキストをHTMLエスケープしたり、戻したりするツールです。スマホ表示に最適化しています。

HTML特殊文字変換｜コードをホームページに載せる時に便利 | すぐに使える便利なWEBツール | Tech-Unlimited

HTML特殊文字の変換ツール。HTMLやコードをホームページに載せる時にHTML的に特殊な意味を持つ特殊文字を正常に表示されるように変換するツールです。

Simplicityでソースコードをハイライト表示する方法

Simplicity2.1.6からプラグインを使用せずとも、ソースコードをハイライト表示出来るようになりました。ソースコードのハイライト表示には、jQueryプラグインのhighlight.jsを利用しています。ハイライト機能追加は、以前か

LINE風会話文の書式

負うた子に助けられたか

この谷はいい、いつ来ても心が和む

今度の旅はどうじゃった？

うーんひどいものだ

南でまた２つの国が腐海にのまれてしまった

<p class="left_balloon">負うた子に助けられたか</p>

<p class="right_balloon">この谷はいい、いつ来ても心が和む</p>

<p class="left_balloon">今度の旅はどうじゃった？</p>

<p class="right_balloon">うーん ひどいものだ</p>

<p class="right_balloon">南でまた２つの国が腐海にのまれてしまった<img alt="" src="https://wp-simplicity.com/wp-content/uploads/2014/12/1724.png" /></p>

<div class="clear_balloon"></div>

サンをどうする気だ？

あの子も道連れにするつもりか？

いかにも人間らしい手前勝手な考えだな。

サンは我が一族の娘だ。

森と生き、森が死ぬ時は共に滅びる。

あの子を解き放て！

あの子は人間だぞ！

黙れ小僧！

<div class="line_back">
  <p class="left_balloon">サンをどうする気だ？</p>
  <p class="left_balloon">あの子も道連れにするつもりか？</p>

  <p class="right_balloon">いかにも人間らしい手前勝手な考えだな。</p>
  <p class="right_balloon">サンは我が一族の娘だ。</p>
  <p class="right_balloon">森と生き、森が死ぬ時は共に滅びる。</p>

  <p class="left_balloon">あの子を解き放て！</p>
  <p class="left_balloon">あの子は人間だぞ！</p>
  
  
  <p class="right_balloon">黙れ小僧！</p>

  <div class="clear_balloon"></div>
</div>