質問編集履歴
1
誤解を与えないように詳細に記載
test
CHANGED
|
File without changes
|
test
CHANGED
|
@@ -1,9 +1,14 @@
|
|
|
1
1
|
imgタグに「width」「height」を指定すると画像サイズが固定されてしまうため、ネットで調べるとCSSに「height: auto;」を指定するといった解決方法がでてきます。
|
|
2
2
|
たしかに「height: auto;」を指定すると画像サイズが固定されることはなくなりました。
|
|
3
3
|
|
|
4
|
-
ただ、画像が読み込めない
|
|
4
|
+
ただ、「height: auto;」を指定した状態で画像が読み込めない場合、高さがなくなりレイアウトが崩れる状態になります。
|
|
5
5
|
対処法について調べてはみたのですが、aspect-ratioを使う、画像をdivで囲みdiv側で高さを指定するなど人によって対応がバラバラでした。
|
|
6
6
|
|
|
7
7
|
画像1つ1つに上記を対応するのも手間がかかるのでみなさんはどうしているのか気になり質問させていただきました。
|
|
8
8
|
|
|
9
|
+
「height: auto;」をつける理由は、画像サイズが固定だとデザイン的に違和感があるため、ブラウザ幅を縮めても画像を可変さたいという理由です。
|
|
10
|
+
|
|
11
|
+
|
|
12
|
+
それなら「width」「height」指定しなければいいというご意見もあるかと思いますが、imgタグに「width」「height」を指定しないとサイトの評価が下がると聞いたため付与しています。
|
|
13
|
+
|
|
9
14
|
自分的には、基本は「height: auto;」でレイアウトシフトが気になる場合は個別対応かなとは思っています。
|