「グリッド」とは?


「グリッド」とは、mekumaのレイアウトの構成要素の1つであり、ブロックを配置する「枠」のようなものです。
グリッドは横幅を1~16の間で指定でき、1つのグリッドの中に子グリッドを配置することができます。
グリッドを組み合わせることにより、HTMLなどの知識がなくても複雑な構成のウェブサイトを構築できます。

グリッドの追加方法

STEP01.

グリッドを追加する親グリッドにカーソルを合わせると表示される「+」アイコンをクリックし、さらに「 グリッドの追加 」をクリックします。


STEP02.

「グリッドの追加」ウィンドウが表示されるので、各項目を指定・入力したうえで「登録」ボタンをクリックしてください。

No. 名称 説明
01 横幅 グリッドの横幅(1~16)を指定します。
最大値の16を指定すると、親グリッド内で全幅表示されます。
02 コンテンツのアラインメント 追加するグリッドの横幅が親グリッドの横幅よりも小さい場合の表示方法(全幅表示 / 左寄せ / 右寄せ)を指定します。
03 オフセット 指定した横幅内でグリッドの左側に空白を作成する場合に指定(1~16)します。
横幅16のグリッドにおいてオフセットに「1」を指定すると、左側に1グリッド分の空白が作成されます。
04 ユーザー定義CSSクラス グリッドに任意のCSSクラスを設定できます。
設定したCSSクラスに対して、 CSSエディター で独自のスタイルを適用する際などに利用します。
05 背景色 グリッドの背景色を指定します。
06 「キャンセル」ボタン クリックするとグリッドの追加を中止します。
07 「登録」ボタン クリックすると指定した内容でグリッドを追加します。

グリッドの編集方法

STEP01.

編集するグリッドにカーソルを合わせると表示される歯車アイコンをクリックします。


STEP02.

「グリッドの編集」ウィンドウが表示されるので、各項目を指定・入力したうえで「保存」ボタンをクリックしてください。

No. 名称 説明
01 横幅 グリッドの横幅(1~16)を指定します。
最大値の16を指定すると、親グリッド内で全幅表示されます。
02 コンテンツのアラインメント 編集するグリッドの横幅が親グリッドの横幅よりも小さい場合の表示方法(全幅表示 / 左寄せ / 右寄せ)を指定します。
03 オフセット 指定した横幅内でグリッドの左側に空白を作成する場合に指定(1~16)します。
横幅16のグリッドにおいてオフセットに「1」を指定すると、左側に1グリッド分の空白が作成されます。
04 ユーザー定義CSSクラス グリッドに任意のCSSクラスを設定できます。
設定したCSSクラスに対して、 CSSエディター で独自のスタイルを適用する際などに利用します。
05 背景色 グリッドの背景色を指定します。
06 背景画像のアップロードボタン グリッドの背景としてアップロードする画像を指定します。
07 背景画像の保存ボタン 「背景画像のアップロードボタン」で指定したファイルを保存し、グリッドの背景画像に反映させます。
08 「キャンセル」ボタン クリックするとグリッドの編集を中止します。
09 「保存」ボタン クリックすると指定した内容でグリッドを保存します。

グリッドの削除方法

削除するグリッドにカーソルを合わせると表示されるゴミ箱アイコンをクリックします。
削除の実行を確認するポップアップが表示されるので、「OK」ボタンをクリックしてください。

お役に立ちましたか?

はい いいえ
お役に立ちましたか
理由をお聞かせください
フィードバックありがとうございました