CSS propriedade marker-start

Definição e uso

marker-start A propriedade ponta aponta para um marcador que será desenhado no primeiro ponto do caminho do elemento.

A forma do marcador é definida pelo elemento SVG <marker> e referenciada pelo valor url().

CSS marker-start O valor dessa propriedade substitui o valor da propriedade marker-start no SVG.

Exemplo

Exemplo 1

Ponteia para um marcador (seta) que será desenhado no primeiro ponto do caminho do elemento:

#test {
  marker-start: url(#arrow);
}

Experimente você mesmo

Exemplo 2

Ponteia para um marcador (círculo) que será desenhado no primeiro ponto do caminho do elemento:

#test {
  marker-start: url(#circle);
}

Experimente você mesmo

Sintaxe CSS

marker-start: none;url|initial|inherit;

Valor da propriedade

Valor Descrição
none Valor padrão. Não será desenhado nenhum marcador no primeiro ponto do caminho.
url Referência de URL para o marcador definido pelo elemento SVG <marker>.
initial Defina essa propriedade para seu valor padrão. Consulte initial.
inherit Herda essa propriedade do elemento pai. Consulte inherit.

Suporte do navegador

Os números na tabela representam a versão do navegador que suportou completamente essa propriedade pela primeira vez.

Chrome Edge Firefox Safari Ópera
80 80 72 13.1 67

Páginas relacionadas

Tutorial:Marcador SVG

Referência:CSS propriedade marker

Referência:CSS propriedade marker-mid

Referência:CSS propriedade marker-end