Smūgio plotis - CSS-gudrybės

Anonim

stroke-widthCSS nuosavybė yra nustatant sienos plotį SVG formų.

.module ( stroke-width: 2; )

Prisiminti:

  • Tai bus nepaisyti pristatymas atributą
  • Tai nebus nepaisyti inline stiliaus pvz

Vertybės

stroke-widthTurtas gali priimti bet kokį skaičių, įskaitant sveikų skaičių, po kablelio, ir procentais:

  • stroke-width: 2px
  • stroke-width: 2em
  • stroke-width: 2
  • stroke-width: 2.5
  • stroke-width: 15%

Atkreipkite dėmesį, kad vieneto identifikatoriaus (ty pxir em) nereikia. Skaičius be vienetų yra vertė, pagrįsta SVG koordinačių sistema viewBox. Pavyzdžiui, 5atvaizduoja tą patį, kaip 5%ir a viewBox, kuris nustatytas kaip 0 0 100 100(5/100 = .05 arba 5%), bet 10%tame, kuris yra 0 0 50 50(5/50 = .1 arba 10%).

„CodePen“ peržiūrėkite CSS-Tricks (@ css-tricks) „Pen insult-width“ ypatybę.

Susijęs

  • stroke
  • stroke-dasharray
  • stroke-dashoffset
  • stroke-linecap

Daugiau informacijos

  • SVG 1.1 Spec
  • MDN apie užpildymus ir smūgius

Naršyklės palaikymas

„Chrome“ „Safari“ „Firefox“ Opera T.Y „Android“ „iOS“
Taip Taip Taip Taip 9+ 4.4+ Taip