webサイトデザインAI入門科授業用ブログ

池袋フェリカテクニカルアカデミーの求職者支援訓練の授業解説ブログです。

2021-08-05から1日間の記事一覧

過去の生徒の架空サイト

school.yachin29.com xi-s.sub.jp

img要素をobject-fitで自由な大きさにトリミングする

今まではimg要素には「max-width:100%」を指定して、レスポンシブレイアウトに対応させて来ました。俗に言うフルードイメージです。 画像の縦横比(アスペクト比)が一定の場合はフルードイメージでいいのですが、柔軟なレイアウトの場合は「object-fit」を…