Инсульт - CSS-хитрости

Anonim

strokeСвойство в CSS для добавления границы к SVG форм.

.module ( stroke: black; )

Помните:

  • Это будет переопределить атрибут представления
  • Это не переопределит встроенный стиль, например

Значения

strokeСвойство может принимать любое значение CSS цвета.

  • Именные цвета - orange
  • Цвета шестигранные - #FF9E2C
  • Цвета RGB и RGBa - rgb(255, 158, 44) and rgba(255, 158, 44, .5)
  • Цвета HSL и HSLa - hsl(32, 100%, 59%) and hsla(32, 100%, 59%, .5)

Как ни странно, он strokeтакже принимает шаблоны фигур SVG, которые определены внутри defsэлемента:

.module ( stroke: url(#pattern); )

См. Свойство Pen stroke в CSS-Tricks (@ css-tricks) на CodePen.

Связанный

  • fill
  • stroke-dasharray
  • stroke-dashoffset
  • stroke-linecap
  • stroke-width

Дополнительная информация

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

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

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