Inme - CSS Hileleri

Anonim

CSS'deki strokeözellik, SVG şekillerine kenarlık eklemek içindir.

.module ( stroke: black; )

Hatırlamak:

  • Bu , bir sunum özelliğini geçersiz kılar
  • Bu , satır içi stili geçersiz kılmaz, örneğin

Değerler

strokeMülkiyet herhangi bir CSS renk değeri kabul edebilir.

  • Adlandırılmış renkler - orange
  • Onaltılık renkler - #FF9E2C
  • RGB ve RGBa renkleri - rgb(255, 158, 44) and rgba(255, 158, 44, .5)
  • HSL ve HSLa renkleri - hsl(32, 100%, 59%) and hsla(32, 100%, 59%, .5)

Harika bir strokeşekilde, bir defsöğenin içinde tanımlanan SVG şekillerinin modellerini de kabul eder :

.module ( stroke: url(#pattern); )

CodePen'de CSS-Tricks (@ css-tricks) tarafından Kalem konturu özelliğine bakın.

İlişkili

  • fill
  • stroke-dasharray
  • stroke-dashoffset
  • stroke-linecap
  • stroke-width

Daha fazla bilgi

  • SVG 1.1 Özellikleri
  • Dolgular ve konturlarda MDN

Tarayıcı Desteği

Krom Safari Firefox Opera IE Android iOS
Evet Evet Evet Evet 9+ 4.4+ Evet