object-positionについて

Question

↑にて、画像の縦横比を保ってトリミングすることはわかったのですが、トリミング位置を変えたいです。現在は画像の真ん中でトリミングされるのですが、object-positionにて位置を変更できるとわかりましした。画像の一番上からトリミングを開始したい場合はどのように設定すればよいでしょうか？よろしくお願いいたします。

Comments

[kei344]

過去の質問について、「解決済」になっていないものが多数見受けられます。解決したものは「ベストアンサー」を選び、自力で解決した場合はその方法を解答欄に書き、もし万が一解決していないのであれば質問を編集するなどしてみてください。

[Zac1988]

解決済みのものはベストアンサーを選ばせてもらっていますが、回答に対して追加でわkらないところを質問したもののうち、回答が帰ってきていないものについては、ベストアンサーを選んでないですね

[m.ts10806]

先に以前の問題を解決してから次の質問に行きましょうってことかと。回答依頼も出せますし、未解決のまま次々質問をたてるって良くないです。

[Zac1988]

ベストアンサーを一通り選びました！

Answer 1

#object-position {
    object-position: center top;
    object-fit: cover;
}

【object-position - CSS: カスケーディングスタイルシート | MDN】
https://developer.mozilla.org/ja/docs/Web/CSS/object-position

【object-positionプロパティの意味と使い方 | CSS | できるネット】
https://dekiru.net/article/13273/

【置換要素のレイアウトのためのプロパティ - object-fitとobject-position | CodeGrid】
https://app.codegrid.net/entry/css-object

Comments

[Zac1988]

うまく反映され、思っていた通りの見た目に変更できました。ありがとうございました！