Editor X:コンテナとセクションのオーバーフローコンテンツを設定する

読了時間:3分
Editor X は、代理店とフリーランサー向けの新しいプラットフォームである Wix Studio に移行します。Wix Studio について
コンテナまたはセクション内のコンテンツが大きくなりすぎて、コンテナの端からはみ出す場合があります。Editor X では、すべてのブレイクポイントでオーバーフローコンテンツの動作を決定できます。コンテンツを表示するか、端を切り取ってオーバーフロー部分を非表示にするかを選択できます。
テキストボックスがはみ出しているコンテナの例
この記事では、下記の項目について説明します:
ヒント:
高さが「自動」に設定されている場合、コンテンツはコンテナまたはセクションの下部からオーバーフローすることはありません。これは、コンテンツに合わせて自動的にサイズ変更されるためです。

オーバーフローコンテンツを表示する

コンテンツが大きすぎてコンテナやセクションに収まらない場合でも、オーバーフローコンテンツを表示することができます。
注意:
デフォルトでは、オーバーフローコンテンツは「表示」に設定されています。

オーバーフローコンテンツを表示する方法:

  1. 該当するコンテナまたはセクションをクリックします。
  2. Editor X 右上で「要素設定パネル」アイコン  をクリックします。
  3. レイアウト」タブ  をクリックします。
  4. オーバーフローコンテンツ」ドロップダウンから「表示」を選択します。
以下の例では、オーバーフローしたテキストが引き続き表示されています:
オーバーフローコンテンツを表示するように設定されたコンテナの例で、オーバーフローしたテキストボックスが完全に表示されています

オーバーフローコンテンツを非表示にする

大きすぎてセクションまたはコンテナの外側にはみ出すコンテンツを非表示にすることができます。コンテンツは切り取られるため、訪問者には表示されません。

オーバーフローコンテンツを非表示にする方法:

  1. 該当するコンテナまたはセクションをクリックします。
  2. Editor X 右上で「要素設定パネル」アイコン  をクリックします。
  3. レイアウト」タブ  をクリックします。
  4. オーバーフローコンテンツ」ドロップダウンから「非表示」を選択します。
以下の例では、オーバーフローテキストが切り取られて非表示になっています:
オーバーフローコンテンツを表示するように設定されたコンテナの例で、オーバーフローしたテキストボックスが切り取られています

オーバーフローコンテンツをスクロールする

セクションまたはコンテナにコンテンツを追加し、スクロール時にオーバーフローが表示されるように設定します。スクロールバーを追加するかどうかを選択したり、スクロールの方向(縦、横、またはその両方)を設定することもできます。

オーバーフローコンテンツをスクロールする方法:

  1. 該当するコンテナまたはセクションをクリックします。
  2. Editor X 右上で「要素設定パネル」アイコン  をクリックします。
  3. レイアウト」タブ  をクリックします。
  4. オーバーフローコンテンツ」ドロップダウンから「スクロール」を選択します。
  5. スクロールの方向」ドロップダウンをクリックし、スクロールを縦、横、または両方にするか選択します。
  6. トグルをクリックして、スクロールバーを表示または非表示にします。
以下の例では、訪問者はスクロールダウンしてオーバーフローテキストを確認できます:
スクロールするようにオーバーフローコンテンツが設定されているコンテナの例で、訪問者はスクロールバーを使用してオーバーフローしたテキストボックスを確認します

お役に立ちましたか?

|