段落ブロック

段落は、すべての文章の基本の構成ブロックです。設定できる項目は多いですが、色・タイポグラフィ・サイズ・枠線の4つに分けて考えます。

段落ブロックの設定方法を説明していきます。全てを知る必要は無いので、自分の使いたい部分だけを覚えておけば良いと思います。

サンプルテキスト

軽いストレッチやヨガをすることで、血流が良くなり、エネルギーが湧いてきます。私は最近、10分間のストレッチを取り入れていますが、心がスッキリするのでおすすめです。

段落の設定

「段落」は文字の集まりを一つにまとめています。文字単体の指定や設定と異なるので注意して下さい。


スタイル

「段落」の見た目をプリセットしたスタイルで変更する事が出来ます。

あらかじめ決められたスタイルを4つから選択できます。

※あまり使わないです

デフォルト サンプル

軽いストレッチやヨガをすることで、血流が良くなり、エネルギーが湧いてきます。私は最近、10分間のストレッチを取り入れていますが、心がスッキリするのでおすすめです。

Subtitle サンプル

軽いストレッチやヨガをすることで、血流が良くなり、エネルギーが湧いてきます。私は最近、10分間のストレッチを取り入れていますが、心がスッキリするのでおすすめです。

Annotation サンプル

軽いストレッチやヨガをすることで、血流が良くなり、エネルギーが湧いてきます。私は最近、10分間のストレッチを取り入れていますが、心がスッキリするのでおすすめです。


「段落」の文字の色と背景を指定します。テーマに合わせたプリセットされた色を選ぶ方法と色を直接指定したり色コードで指定が可能です。

テキスト

背景

リンク

の色を指定します

テキストサンプル

背景サンプル

軽いストレッチやヨガをすることで、血流が良くなり、エネルギーが湧いてきます。私は最近、10分間のストレッチを取り入れていますが、心がスッキリするのでおすすめです。


タイポグラフィ

タイポグラフィはスタイルのオプションが豊富です。次の画像は全てのオプションを表示した場合になります。


サイズ 

文字の大きさになります。基本は、S、M、L、XL、XXLの5サイズですが、フォントサイズを直接指定する方法もあります。

文字サイズ S サンプル

軽いストレッチやヨガをすることで、血流が良くなり、エネルギーが湧いてきます。私は最近、10分間のストレッチを取り入れていますが、心がスッキリするのでおすすめです。

文字サイズ M サンプル

軽いストレッチやヨガをすることで、血流が良くなり、エネルギーが湧いてきます。私は最近、10分間のストレッチを取り入れていますが、心がスッキリするのでおすすめです。

文字サイズ L サンプル

軽いストレッチやヨガをすることで、血流が良くなり、エネルギーが湧いてきます。私は最近、10分間のストレッチを取り入れていますが、心がスッキリするのでおすすめです。

フォント

「段落」のフォントを変更する事が出来ます。

フォントのコンボボックスを選択してフォントを変更します。

フォントの種類はテーマに登録されたものとなり、フォントの追加にかんしては、こちらを参考にして下さい。

外観

文字の見た目を調整します。文字の太さや斜めにします。使用するフォントにより大きく変化しない場合もあります。

  • ボールド
    文字を太くする
  • イタリック
    文字を少し斜めにする

セミボールド サンプル

軽いストレッチやヨガをすることで、血流が良くなり、エネルギーが湧いてきます。私は最近、10分間のストレッチを取り入れていますが、心がスッキリするのでおすすめです。

標準イタリック サンプル

軽いストレッチやヨガをすることで、血流が良くなり、エネルギーが湧いてきます。私は最近、10分間のストレッチを取り入れていますが、心がスッキリするのでおすすめです。

文字サイズ L サンプル

軽いストレッチやヨガをすることで、血流が良くなり、エネルギーが湧いてきます。私は最近、10分間のストレッチを取り入れていますが、心がスッキリするのでおすすめです。

行の高さ

行の高さを調整します。

行の高さ 1.5(標準)  サンプル

軽いストレッチやヨガをすることで、血流が良くなり、エネルギーが湧いてきます。私は最近、10分間のストレッチを取り入れていますが、心がスッキリするのでおすすめです。

行の高さ 1.8 サンプル

軽いストレッチやヨガをすることで、血流が良くなり、エネルギーが湧いてきます。私は最近、10分間のストレッチを取り入れていますが、心がスッキリするのでおすすめです。

文字間隔

文字の間隔を調整します。

文字間隔 標準  サンプル

軽いストレッチやヨガをすることで、血流が良くなり、エネルギーが湧いてきます。私は最近、10分間のストレッチを取り入れていますが、心がスッキリするのでおすすめです。

文字間隔 10px サンプル

軽いストレッチやヨガをすることで、血流が良くなり、エネルギーが湧いてきます。私は最近、10分間のストレッチを取り入れていますが、心がスッキリするのでおすすめです。

装飾

「段落」ブロックを「下線」と「打消し線」で装飾します。

標準  サンプル

軽いストレッチやヨガをすることで、血流が良くなり、エネルギーが湧いてきます。私は最近、10分間のストレッチを取り入れていますが、心がスッキリするのでおすすめです。

下線 サンプル

軽いストレッチやヨガをすることで、血流が良くなり、エネルギーが湧いてきます。私は最近、10分間のストレッチを取り入れていますが、心がスッキリするのでおすすめです。

打消し線 サンプル

軽いストレッチやヨガをすることで、血流が良くなり、エネルギーが湧いてきます。私は最近、10分間のストレッチを取り入れていますが、心がスッキリするのでおすすめです。

「段落」ブロックの単位で装飾をするので、文字単位での変更は別の手法となります。

方向

段落の読む方向を指定します。横方向と縦方向の2つになります。

縦方向は、縦書きの小説のような改行が出来ません。[Shift]+[Retrun]で段落内の改行は可能ですが、段落の追加で横方向に追加出来なく、他のブロックと組み合わせた応用的な手法となるので割愛します。

という事から、ほとんど使わないけど装飾用と考えてよいと思います。

横(標準)  サンプル

軽いストレッチやヨガをすることで、血流が良くなり、エネルギーが湧いてきます。

縦 サンプル

軽いストレッチやヨガをすることで、血流が良くなり、エネルギーが湧いてきます。私は最近、10分間のストレッチを取り入れていますが、心がスッキリするのでおすすめです。


※サンプル部分はセンタリングしています。

サイズ

サイズオプションの表示

サイズには「サイズオプション」として「パディング」と「マージン」があります。表示されていない場合は次の様にしてオプションを表示します。

「+」をクリック

オプションが表示されるので、「パディング」をクリック

パディングとマージン

構成する要素に対する空白の間隔を作ります。

パディング

要素の内側の空白サイズ

マージン

要素の外側の空白サイズ

パディング サンプル

軽いストレッチやヨガをすることで、血流が良くなり、エネルギーが湧いてきます。私は最近、10分間のストレッチを取り入れていますが、心がスッキリするのでおすすめです。

マージン サンプル

軽いストレッチやヨガをすることで、血流が良くなり、エネルギーが湧いてきます。私は最近、10分間のストレッチを取り入れていますが、心がスッキリするのでおすすめです。


枠線

「段落」ブロックに枠線をつけます。色・太さと角丸が指定可能です。

枠線と角丸

枠線

角丸

枠線 サンプル

軽いストレッチやヨガをすることで、血流が良くなり、エネルギーが湧いてきます。私は最近、10分間のストレッチを取り入れていますが、心がスッキリするのでおすすめです。

枠線をつけると文字と隙間がなくなり見にくいので、枠線の内側に空白をつける為にパディングを使って空白を追加します。

枠線と角丸+パディング サンプル

軽いストレッチやヨガをすることで、血流が良くなり、エネルギーが湧いてきます。私は最近、10分間のストレッチを取り入れていますが、心がスッキリするのでおすすめです。

このように、ブロックに対して複数の構成を組み合わせてコンテンツを見やすいデザインにしていきます。


高度な設定

独自にアンカーを入れたりCSS名を指定する事が出来ます。

HTMLアンカー

追加CSSクラス

通常はあまり必要がありません。