HTMLとCSSのみでパララックス風ページを作る - イラストレーター深蔵（ふかぞう）

まだまだ根強いパララックスページ。 jQueryのプラグインを駆使すれば、割と簡単に作成することができますが、 もっと簡単に、それっぽく見えればいいという方向けに、HTMLとCSSのみで実装してみました。 以下ソース。 まずはCSS。 @charset "utf-8"; /* HTMLとBODYのマージン、パディングを0にして高さを100％にしておく */ /* reset */ html ,body { margin:0px; padding:0px; height:100%; } /* 大枠となるクラス */ .wrapper { height:100%; /* 高さ100% */ background:fixed 50% no-repeat; /* 背景指定。50%の位置に固定表示してリピートなし */ background-size:cover; /* ブラウザのサイズに画像サイズ