CSS paint-order özelliği

Tanım ve kullanım

paint-order Bu özellik, SVG elementi veya metninin çizim sırasını belirtir.

Dikkat:Metin elementleri için yalnızca çizim (stroke) ve doldurma (fill) sırasını değiştirebilirsiniz, çünkü işaretçiler (markers) uygulanamaz.

SVG <circle> elementinin çizim sırasını değiştirme:

circle {
  paint-order: stroke fill;
}

Rainbow doldurma ile SVG <text> elementinin çizim sırasını değiştirme:

text {
  paint-order: stroke fill;
}

paint-order: normal|bir değer|iki değer|üç değer|initial|inherit;

Değer	Açıklama
normal	Öntanımlı değer. Çizim sırası doldurma, çizim, işaretçiler olacaktır.
bir değer	Çizim, belirtilen değerlerden başlayacak ve ardından öntanımlı sırayla kalanı çizer. Eğer sadece "stroke" belirtildiysen, bir sonraki çizim faaliyeti doldurma (fill) olacaktır, ardından da işaretçiler (markers) olacaktır.
iki değer	Çizim, belirtilen değerlerden başlayacak ve ardından öntanımlı sırayla kalanı çizer. Eğer "stroke markers" belirtildiysen, bir sonraki çizim faaliyeti doldurma (fill) olacaktır.
üç değer	Çizim, belirtilen değerlere göre yapılacaktır.
initial	Bu özelliği öntanımlı değerine ayarlar. bkz.: initial.
inherit	Bu özelliği ebeveyn elementinden miras alır. bkz.: inherit.

Öntanımlı değer:	normal
Geçişlik:	evet
Animasyon yapımı:	Desteklenmiyor. Daha fazla bilgi için bkz.:Animasyonla ilgili özellikler.
Sürüm:	CSS3
JavaScript dilbilgisi:	object.style.paintOrder="stroke fill"

Tablodaki rakamlar, bu özelliği tam olarak destekleyen ilk tarayıcı sürümünü gösterir.

Chrome	Edge	Firefox	Safari	Opera
35.0	17.0	60.0	8.0	22.0