【CSS】clip-pathプロパティで背景を任意の形にしたときのメモ

電脳備忘録

clip-pathプロパティというの今更知りました。背景を任意の形にできるのはいいですね。 2023-02-16-001.jpg こんな感じの背景を作りたかったのですが、clip-pathプロパティで簡単に作ることができました。

.container {
background-color: #4682b4;
clip-path: polygon(0% 100%, 0% 0%, 100% 0%, 100% 80%);
width: 100%;
height: 600px;
}

設定値は他にもありますが、それらについては必要になったら調べようと思います。

clip-path

MDN

広告

ブログの維持費に充てるでございます・・・。