CSSのbackground-imageプロパティは背景画像に関するCSSですが、単に背景に画像を表示させるだけでなく、実はアニメーションと組み合わせて多彩な表現ができます。本記事ではbackground-imageの特性を活かしたアニメーション表現について解説します。 サンプルコードもありますので、実際の案件に取り入れてみたりbackground-imageの仕組みについて学んでみたりしてください。※サンプルコードはSass(SCSS)を使用しています。 サンプルを別ウインドウで開く コードを確認する background-imageとアニメーション タイトルと矛盾するようですが、background-imageプロパティ自体はanimationプロパティやtransitionプロパティを用いてアニメーションできません。もしbackground-imageプロパティをアニメーション可能に
![backgruond-imageを使ったCSSのアニメーションテクニック - ICS MEDIA](https://cdn-ak-scissors.b.st-hatena.com/image/square/da6b1b02be2e0e3ca4f86651f2078dd0bc52f446/height=288;version=1;width=512/https%3A%2F%2Fics.media%2Fentry%2F220602%2Fimages%2Feyecatch.png)