CSSと1つのdiv要素で出来る表現いろいろ

Ads

Result

1つのブロック要素とCSSで出来る表現をまとめたもの。スタイルの参考になりそうだったので備忘録

今更+余談ですけどこういう使い方↓できたんですね

<div n1></div>

こう書いて以下のように指定する

[n1] {
  position: relative;
}

思いつかなかったのでなんか新鮮でした

件のソースコードはPenをご参照ください

can i use

個人的に気になったプロパティのブラウザ対応状況です

↑ repeating-linear-gradientのブラウザ対応状況です


↑ conic-gradientのブラウザ対応状況です


↑ clip-pathもおさらいで載せておきます。

via

Single div challenge