カスタムモジュラーグリッドの設定方法Zero Block

モジュラーグリッドを使用すると、デザインの基本構造を定義し、レイアウトの作業を迅速に行うことができます。ウェブサイトのすべての要素の統一されたレイアウトを作成し、視覚的な秩序を維持するのに役立ちます。

デフォルトでは、Tilda で 12 列のグリッドが使用されます。

グリッドを設定するには、Zero Block → Settings → "Zero Block Settings "の下にある "Open "をクリックします。

グリッドは解像度ごとに個別に変更されます：デスクトップとモバイルでは異なります。

グリッドの表示／非表示は、「G」キー、または画面右上の3つの点をクリック→「グリッドを表示」／「グリッドを非表示」、 Zero Block 「設定」で「グリッドを非表示」に切り替えることで可能。

縦グリッドの設定

列数は列の数を表します；
列の幅は各列の幅をピクセルで表します；
列の溝は列と列の間隔列と列の間隔をピクセルで表します；
列のマージンはグリッドの左右の間隔をピクセル単位で表します。

一部の値をロックして、他の値を調整しても変更されないようにすることができます。値をロックするには、必要なパラメータの横にあるロックアイコンをクリックします。

水平グリッドの設定

行ベースラインは水平方向の行の間隔をピクセル単位で表します；
モジュールの高さは行（モジュール）の数で、その後に次のモジュールの開始を示す空白行が続く；
行のマージンはグリッドの下と上の間隔（ピクセル単位）。

一般的なグリッド設定

色は列の色です（エディタでのみ表示されます）；
不透明度は列の塗りつぶしの不透明度です；
ボーダーの不透明度は列のボーダーの不透明度です。

重要：デフォルトでは、グリッド設定はプロジェクト全体に指定されます。つまり、ウェブサイトのすべてのZero Block 、同じモジュール式グリッドが自動的に使用されます。

特定のブロックに固有のグリッドを作成するには、グリッド設定を開き、"Use For "オプションで "Current block "値を選択します。これにより、現在のブロックにのみ設定が適用され、他のブロックはデフォルトのグリッドを使用します。はデフォルトのグリッドを使用します。

いつでも変更を取り消し、グリッド設定を元に戻すことができます。そのためには、「グリッド設定をデフォルトに戻す」ボタンをクリック→ポップアップウィンドウで「OK」をクリックします。