Löögilaius - CSS-trikid

Anonim

stroke-widthVara CSS on seadmiseks laius piiri SVG kujundeid.

.module ( stroke-width: 2; )

Pidage meeles:

  • See on alistada esitlus atribuut
  • See ei alista sisemist stiili, nt

Väärtused

stroke-widthVara võib nõustuda mis tahes arvu, sealhulgas täisarve, kümnendkohtade ja protsendid:

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

Pange tähele, et ühiku identifikaatorit (st pxja em) ei nõuta. Ühikuteta arv on väärtus, mis põhineb SVG koordinaatide süsteemil viewBox. Nii 5renderdab näiteks sama mis 5%a-s, viewBoxmille väärtuseks on seatud 0 0 100 100(5/100 = .05 või 5%), kuid 10%ühes 0 0 50 50(5./50 = .1 või 10%).

Vaadake CodePenilt CSS-Tricks atribuuti Pen stroke-width (CSS-Tricks) (@ css-tricks).

Seotud

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

Rohkem informatsiooni

  • SVG 1.1 spetsifikatsioon
  • MDN täidistel ja löökidel

Brauseri tugi

Chrome Safari Firefox Ooper IE Android iOS
Jah Jah Jah Jah 9+ 4.4+ Jah