Штрих-колпачок - 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 по заливкам и штрихам

Поддержка браузера

Хром Сафари Fire Fox Опера IE Android iOS
да да да да 9+ 4.4+ да