ミギムキ

[CSS] コピペで使える平行四辺形の見出し

サンプルコード

.parallelogram { display: inline-block; position: relative; z-index: 1; padding: 0px 1em; color: #fff; font-weight: bold; } .parallelogram::before { position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0px; z-index: -1; transform: skewX(-20deg); background-color: #3388dd; content: ""; }

仕組み、解説、補足など

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

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

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