トップページのヘッダー画像のサイズ拡大について

ヘッダー画像を設定して横幅サイズを100%にした時に、他のレスポンシブ設定した画面にいくまでの間、横幅を大きくすると画像自体が拡大されていき動的に比率を保つ方法はないのか気になりました。

%で指定してもautoと同じようになりますので、縦幅は固定値を入力して対応することが多いのですがもし解決方法がありましたらご教授頂ければと思います。

画像ボックスを選択して右上のスイッチをimg でできますよー。

【参考】

画像の比率を固定することはできますか?

https://help.studio.design/ja/articles/2638959-画像の比率を固定することはできますか

【余談】
CSSでは以下のように入れればできるはずなのですが、STUDIOってイメージ素材が選べないのですね。。。 ↑の方法が公式のやり方になると思います。
img {
width: 100%;
height: auto;
}

「いいね!」 1

@tsubasa
ありがとうございます!
選択しているコンポーネントに依存しますよね。

画像の上に要素を置きたかったのでBOXの状態で何とかしたいと考えていたのですが、要素含めて1枚の画像にすることで対処したいと思います!

※この方法を参考にする方はキーワードも画像化しますとSEOが弱くなるので気をつけてください。

「いいね!」 1

@pero
BOX(横幅100%・縦幅auto)にimgを入れてさらにその上から要素を絶対位置で配置するのはどうでしょう?(ㆁωㆁ*):bulb:


imgの上に要素を配置する方法 - Watch Video

「いいね!」 2

@mochi
これめっちゃいいですね!!
絶対位置で配置する発想がありませんでした!!
人を使うと頭が見切れたり配置で悩むことが多かったので使用させて頂きます!!
ありがとうございます!!

「いいね!」 2

良かったです〜:star:是非試してみてください(^^)/

「いいね!」 2