Stroke-linecap - CSS-tricks

Anonim

Den stroke-linecapegendom i CSS är för att ställa in start- och slutpunkter en gräns på SVG former.

.module ( stroke-linecap: round; )

Kom ihåg:

  • Detta kommer att åsidosätta en presentation attribut
  • Detta kommer inte att åsidosätta en inline stil, t.ex.

Värden

Den stroke-linecapegenskapen kan acceptera följande värden:

  • butt (standard): avslutar slaget med en skarp vinkel på 90 grader
  • square: liknar buttförutom att det sträcker sig utöver banans längd
  • round: lägger till en radie som utjämnar start- och slutpunkterna, som styrs av stroke-width

Se Pen stroke-linecap-egenskapen av CSS-Tricks (@ css-tricks) på CodePen.

Relaterad

  • stroke
  • stroke-dasharray
  • stroke-dashoffset
  • stroke-width

Mer information

  • SVG 1.1 Spec
  • MDN på fyllningar och stroke

Webbläsarstöd

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