Webサイトに画像を載せるときに、画像の中心を基準に表示させる方法
Webサイトを作成するときに、指定した要素の大きさと画像の大きさが異なる場合、普通は
css
background-size:cover;を使って画像の大きさを要素の大きさに揃えるんですけど、これだと画像の表示される部分が左にずれる。
じゃあ画像の中心を基準にサイト上に表示させたいときはどうしたら良いか。それは次のように書けばよい。
css
background-position:centercenter;こう書くことで画像の中心を基準に表示させることができる。1つ目のcenterが左右を表し、2つ目のcenterが上下を表している。
これは、
css
background-position:center;と省略して書くことも可能。
参考リンク：background-positionについて
