メインコンテンツにスキップ
Boxモード・Imgモード

画像ボックスの2種類のモードとその使い分けについて解説します。

Saika avatar
対応者:Saika
1か月以上前に更新

画像ボックスの2つのモード:BoxモードとImgモード

Studioの画像ボックスには、「Boxモード」と「Imgモード」という2つのモードがあります。これらのモードは、画像の扱い方や設定可能な機能が異なります。ボックス右上のスイッチで簡単に切り替えられるので、用途に応じて使い分けましょう。

Boxモード:背景画像として活用

Boxモードでは、画像を背景として扱います。Boxモードは、背景画像としての利用や、画像に効果を加えたい場合に適しています。

特徴

  • フィルタ効果の適用が可能です。

  • 他の要素を子要素として追加できます。

  • 画像自体のサイズ情報は認識されません。

  • 縦横比を保持する設定もできません。

使い方

  1. 画像ボックスを選択します。

  2. 右上のスイッチを[Box]に切り替えます。

  3. [画像]タブから明るさやコントラストなどの調整ができます。

Imgモード:画像そのものを扱う

Imgモードでは、画像を独立した要素として扱います。Imgモードは、画像の縦横比を維持したい場合や、アクセシビリティを考慮してalt属性を設定したい場合に適しています。

特徴

  • 画像の縦横比を認識します。

  • 「auto」設定で比率を保持できます。

  • フィルタ効果は適用できません。

  • 子要素の追加はできません。

  • alt属性(代替テキスト)の設定が可能です。

使い方

  1. 画像ボックスを選択します。

  2. 右上のスイッチを「Img」に切り替えます。

  3. 画面右側のパネルでalt設定ができます。

モードの使い分けのコツ

  • 背景画像として使用する → Boxモード

  • 画像に効果を加えたい → Boxモード

  • 画像の縦横比を維持したい → Imgモード

  • alt属性を設定したい → Imgモード

目的に応じて適切なモードを選択することで、より効果的な画像の使用が可能になります。

image picture

イメージ 写真 素材

こちらの回答で解決しましたか?