CSSで背景画像のシームレスパターンを無限スクロールさせるアニメーション | 9ineBBCSSのアニメーションを使って、シームレスなパターンで背景を無限スクロールさせる 背景画像がシームレスパターンの時に使えるテクニックです。シームレスパターンなパターンをbackgroundで背景画像に利用し、background position で背景画像を動かすアニメーションを繰り返すものです。背景画像は自動でrepeatで敷き詰められるのを利用しています。 ー CODE ー HTML <section> <h1>BACK GROUND SCROLL</h1> </section> CSS body { margin: 0; padding: 0; } section { height: 300px; margin: 100px 10px; background-image: url(bg.png); -webkit-background-size: 500px; background
