WEBサイトを作る際に、トップ画の縦横比がうまく変更できず悩んでいました。
background-size: cover;
にすると画像により、左右上下に余白ができてしまい、スライドショーにすると違和感を感じます。
background-size: cover;
を設定すると、PCで見たときはうまく表示されているのですが、スマホで見たときに左右上下が見切れてしまってなんとも不格好になってしまいます。
widthのサイズをいじったりしてみたのですが、うまくいかず諦めかけていましたが、どうやらこれで解決できそう。
background-size: 100% auto;
参考にしたのは以下リンク。