区切り線

Separator コンポーネントは、ユーザーインターフェースのセクションを視覚的に分け、整理と可読性を向上させます。コンテンツの異なる部分の間に明確な線を引くような役割を果たします。

セパレーターの設定

ラベルの追加(任意)

  • セパレーターにわかりやすいラベルを付けてください。 これはページのさまざまなセクションに文脈や見出しを提供するのに役立ちます。例えば、「顧客情報」というラベルを付けたセパレーターを使用して、そのセクションをページの他の部分と明確に区別することができます。

配置の調整

  • セパレーターの位置を制御します。 セパレーターとそのラベルを次の位置に揃えることができます:

    • 開始: 左揃え(左から右への言語向け)。

    • 中央: ページの中央に配置。

    • 終了: 右揃え(左から右への言語向け)。

アイコンの追加(任意)

  • 視覚的な手がかりでセパレーターを強化します。 セパレーターの目的や分割するコンテンツに合ったアイコンを選んでください。ラベルの左または右にアイコンを配置できます。

セパレーターのスタイリング

  • セパレーターの外観を微調整:

    • ラベル: ラベルのフォント、サイズ、色、スタイルをカスタマイズします。

    • アイコン: アイコンのサイズ、色、位置を調整します。

    • ボーダー: セパレーター線の色、太さ、スタイル(実線、破線、点線)をカスタマイズします。

インタラクションなし

セパレーターコンポーネントは主に視覚的要素であり、インタラクティブな機能やアクションはありません。

最終更新

役に立ちましたか?