ミギムキ

[CSS] セクションごとにコンテナを飛び越えて背景色をつけたい

サンプルコード

html

<div class="container"> <section class="section"> </section> <section class="section"> </section> <section class="section"> </section> </div>

CSS

.container > .section { position: relative; } .container > .section:nth-of-type(even)::before { position: absolute; top: 0px; left: calc(-50vw + 50%); right: calc(-50vw + 50%); bottom: 0px; z-index: -1; background-color: #f8f8f8; content: ""; }

仕組み・解説

ご質問など受け付けています

記事の中でわかりにくかったところ、もっと知りたかったこと、間違っていることなど、何でもお気軽にご連絡ください。

ご連絡は下記フォームを利用いただくか、ツイッターアカウント@flat8migi宛てでもOKです。