CSS レイアウトシフト(ページ読み込み後のずれ)を回避する方法 レスポンシブ対応で縦横比を維持して要素を可変させる方法を使って、レイアウトシフト(ページ読み込み後のずれ)を回避してユーザーのストレスを軽減するテクニックを紹介します。 2021.04.11 CSS
CSS レスポンシブ対応必須テクニック!比率を維持して可変させる方法 レスポンシブ対応にて必須のCSSで縦横比を維持して要素を可変させる方法を紹介します。基本の画像を可変させる方法や高さが固定できない要素の縦横比を維持して可変させる方法を知ると、CSSで高さ方向にpaddingを%で指定した場合の性質が理解できます。 2021.04.11 CSS
CSS CSSだけで実現!画像をトリミングする方法はobject-fitが便利 CSSだけで実現できる画像のトリミング方法を紹介します。object-fitで簡単に実現できるモダンブラウザ向けの方法と、IEでもトリミングしたい場合についても紹介しています。 2021.04.02 CSS