【CSS】position:sticky;で簡単固定！スティッキーヘッダー6選

どうも、ジャングルオーシャンのミケです。 今日はHTMLとCSSで簡単にできる スティッキーヘッダーを作っていこうと思うよ。 スティッキーヘッダーとは Webサイトは基本的に 縦の長さを固定で決めるという事はなくて コンテンツが多くなればなるほどスクロールする長さは多くなりがちなんだ。 その時に と考えることもあるはず！ その願いを叶えてくれるのがスティッキーヘッダーというわけなんだ。 具体的なイメージは用意したサンプルデモページを見てね。 サンプル1のデモページはこちら もし、このページにあるサンプルコードを使ってもうまく実装できないという場合は、こちらの記事を確認してみてね！ 固定させる方法 固定をさせるためには CSSのpositionを使うよ。 positionにも何種類かあって コンテンツを固定できるのはfixedとsticky。 ブラウザで表示している領域の1番上にheader

[miho-satoh-satomi]

css sticky 例