文章 | 基本機能

文章

文章では太字や文字サイズなどを簡単に設定できるウィジウィグを準備。
「HTMLを編集」も行えるのでclass付与をしつつも文章はウィジウィグで変更するなども可能です。

機能で設定できる項目

  • フォント装飾:太字 / 斜体
  • リスト:点 / 番号
  • リンク
  • 配置:左 / 中央 / 右 / 均等
  • フォント:サイズ / カラー
  • 文章:インデント
  • 装飾のクリア
  • HTML編集

  1. <div id="cc-m-xxxxxxxxxx" class="j-module n j-text ">
  2.   <p>文章ブロック(エンターごとにパラグラフになる)</p>
  3.   <p>文章ブロック<br />(シフト+エンターで改行コードになる)</p>
  4. </div>
  1. <div id="cc-m-xxxxxxxxxx" class="j-module n j-text ">
  2.  <p> <strong>太字</strong> </p> <!-- 太字 -->
  3.   <p> <em>イタリック</em> </p> <!-- 斜体 -->
  4.   <ol> <!-- 番号付きリスト -->
  5.     <li>番号リスト </li>
  6.   </ol>
  7.   <ul> <!-- リスト -->
  8.     <li>リスト </li>
  9.   </ul>
  10.   <p> <a href="/" title="TOP">リンク</a> </p> <!-- リンク -->
  11.   <p style="text-align: left;"> 左 </p> <!-- 左寄せ left -->
  12.   <p style="text-align: center;"> 中央 </p> <!-- 中央寄せ center -->
  13.   <p style="text-align: right;"> 右 </p> <!-- 右寄せ right -->
  14.   <p style="text-align: justify;"> 両橋 </p> <!-- 両橋せ justify -->
  15.   <p> <span style="font-size: 16px;">フォントサイズ</span> </p> <!-- font-size -->
  16.   <p style="padding-left: 30px;"> インデント </p> <!-- インデント -->
  17.   <p> <span style="color: #0000ff;">色</span> </p> <!-- 文字色 -->
  18. </div>

文章ブロックでの記入例

太字

イタリック

  1. 番号リスト
  2. 番号リスト
  3. 番号リスト
  • リスト
  • リスト
  • リスト

リンク

左寄せ

中央よせ

右寄せ

インデント