余白（スペーサー）の追加・編集

画像や見出し、文章などを配置していくと、どうしても余白が欲しい時があると思います。その場合はスペーサーというブロック要素を使用します。

例えば下の画像のように、富士山の写真と、下の文章の間に余白を入れたい場合があるとします。

１　間にブロックを作る

まず写真と文章の間に空のブロックを作成します。下の画像のように、①写真を一度クリックして表示されたツールバーの右の②サブメニューを開き、③「後に挿入」を押してください。

下の画像のように空のブロックが挿入されます。

逆に、文章を押して「前に挿入」することでも空のブロックを挿入できます。

ブロックの①「＋」ボタンを押して表示される②ポップアップから「スペーサー」を選びますが、破線の部分はよく使用するブロック要素が表示されるので、スペーサーがない場合には、「すべて表示」を押してください。

「すべて表示」から探した場合は、下の画像のように、左側に並んだアイコンから「スペーサー」を選んでください。

「スペーサー」を押すと下の画像のように、グレーのブロック要素が挿入されます。

「更新」ボタンを押して、実際のホームページを見てみましょう。

上の画像のように、最初と比べ大幅に余白ができています。初期設定では高さが100pxのスペーサーが挿入されます。

下の画像のようにスペーサー設定で数値を入力すれば高さを自由に変更できます。