[CSS3] gradient が使えるところ

gradientは背景にグラデーションを設定できるプロパティです。ってさらりと書いてあった記事がTLにあって、
えー確かアレにも使えたはず…と思ってテストしてみるに至ったんだけど、
ジェネレーターでbackgroundの指定しか出来なかったりとかするから以外とそう認識してる人多いのかも?

まあでも色々考慮するとbackgroundくらいしか使い所なさそーな感じなんで、当たらずしも遠からずなんですけど、
gradientはbackgroundに限らず、なんちゃら-imageというプロパティに使えるのを覚えておきたい。

  • background-image
  • border-image
  • mask-image
  • list-style-image
  • content

list-style-imageに使った場合はデフォで1emの四角になるらしい。
以外に穴なのがcontentプロパティで、urlで画像指定するのと同じ要領で使えたりする。
contentにgradientぶちこんでどうするのって感じですけどもw
CSSでお絵かきするくらい複雑な何かをするときには使えるんじゃないかなと思います。
他にもあったら教えて( ゚д゚)ホスィ…

transformsは該当要素に「傾き」を設定できるプロパティというのも含めて、「えーちがうよちがうよ」って反論出来たら中級者ってことだったらすみません。

Leave a Comment.