個々の辺の境界線を編集する方法

GemPagesではカスタマイズできます 各辺の境界線の厚さ 要素やセクションごとに、上、右、下、左といった各方向の境界線を個別に設定できます。単一の均一な境界線に限定されることなく、異なる太さの境界線を組み合わせることで、コードを一切変更することなく、モダンでブランドイメージに合ったデザインを作成できます。

このガイドでは、この機能の仕組み、使用すべきタイミング、そしてGemPagesエディター内のあらゆる要素にこの機能を適用する具体的な方法について詳しく説明します。

個別の側面枠線を使用するタイミング

デフォルトでは、 境界線を追加する GemPagesの要素に対して、同じ厚さが4辺すべてに適用されます。 個々の側面の境界線 設定で各面のロックを解除できるので、それぞれ個別に設定できます。

たとえば、次のことができます。

• 下線効果を出すために、下部のみに4pxの境界線を適用します。
• 左側に太い6ピクセルの境界線を追加して、コールアウトスタイルを作成します。
• それぞれの面に異なる値を組み合わせて、オリジナルのカードデザインを作成しましょう。

設定パネルにある小さなスイッチですが、これによって幅広いデザインの可能性が広がります。

各辺の境界線を編集することで大きな違いが生まれる、一般的な使用例をいくつかご紹介します。

• 下線付きの見出し: 細い下枠線がセクションタイトルの区切り線をすっきりと見せます
• 強調表示された吹き出しと引用ブロック左枠線が太いことで、重要なコンテンツに注目を集めます。
• タブスタイルのコンテナ上、左、右の境界線（下には境界線なし）がタブのような外観を形成します。
• 非対称な製品カードまたは特徴カード細い枠線と太い枠線を組み合わせて、モダンで目を引くレイアウトを作りましょう。

GemPagesで各辺の境界線を編集する方法

ステップ1：スタイルを適用したい要素またはセクションを選択します

• ページを開く GemPages エディター.
• 編集したい要素またはセクションを直接クリックしてください。

ヒント： ページにネストされた要素が多数ある場合は、 レイヤーツリー 左側のサイドバーで目的のブロックを正確に選択してください。キャンバスをクリックするよりも速く、より正確です。

ステップ2：境界線設定を開く

• 右側の設定パネルで、 形状 のセクションから無料でダウンロードできます。
• 動画内で ボーダー グループ。
• 見つける 厚さ フィールド。
• クリック 厚さフィールドの横にあるアイコン.

ステップ3：各面ごとにカスタム厚さを設定する

境界線の両側を表す4つの入力フィールドが表示されます。

• 上： 上端の厚さ
• 右： 右端の厚さ
• 下： 底辺の厚さ
• 左： 左端の厚さ

各面について：

• 入力欄をクリックしてください。
• 値をピクセル単位で入力してください.