Aspect Ratio

画像やメディア領域の縦横比を固定して表示するためのコンポーネント。画像の読み込み前後でレイアウトが崩れないよう、枠のサイズを比率で確保する。ジョブアンテナでは求人メイン画像(16:9)や企業ロゴ(1:1)のプレースホルダに使う。

基本

ratio に数値(16 / 9 など)を渡すと、幅に応じて高さが自動で決まる。よく使う 16:9 / 4:3 / 1:1 の比較。

求人カードの上部にメイン画像(16:9)、企業名の横にロゴ(1:1)を配置した例。画像未設定でも比率が保たれるためカードの高さが揃う。

フォロー中の企業一覧など、サイズの異なるロゴを 1:1 で統一してグリッドに並べる例。