Штриховий штрих - CSS-хитрощі

Anonim

stroke-linecapВластивість в CSS для установки початкової і кінцевої точок кордону на SVG форм.

.module ( stroke-linecap: round; )

Запам’ятайте:

  • Це буде перевизначити атрибут уявлення
  • Це не замінить вбудований стиль, наприклад

Цінності

stroke-linecapВластивість може набувати таких значень:

  • butt (за замовчуванням): закінчує штрих під різким кутом 90 градусів
  • square: подібне до buttтого, що воно розширює штрих за довжину шляху
  • round: додає радіус, що згладжує початкову і кінцеву точки, що контролюється stroke-width

Перегляньте властивість Pen stroke-linecap від CSS-Tricks (@ css-tricks) на CodePen.

Пов’язані

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

Більше інформації

  • SVG 1.1 Специфікація
  • MDN на заливки та штрихи

Підтримка браузера

Chrome Сафарі Firefox Опера IE Android iOS
Так Так Так Так 9+ 4,4+ Так