ویژگی paint-order CSS

تعریف و کاربرد

paint-order این ویژگی ترتیب رسم عنصر SVG یا متنی را مشخص می‌کند.

توجه:برای عناصر متنی، تنها می‌توان ترتیب خط کشی (stroke) و پر کردن (fill) را تغییر داد، زیرا نشانه‌ها (markers) کاربردی ندارند.

ترتیب رسم عنصر SVG <circle> تغییر دهید:

circle {
  paint-order: stroke fill;
}

ترتیب رسم SVG <text> عناصر با پر کردن خطوط رنگی تغییر دهید:

text {
  paint-order: stroke fill;
}

paint-order: normal|یک مقدار|دو مقدار|سه مقدار|initial|inherit;

مقدار	توضیح
معمولی	مقدار پیش‌فرض. ترتیب رسم، پر کردن، خط کشی و سپس نشانه‌ها خواهد بود.
یک مقدار	رسم از مقادیر داده شده آغاز خواهد شد و سپس به ترتیب پیش‌فرض به باقی‌مانده ادامه خواهد داد. اگر تنها "stroke" مشخص شود، فعالیت بعدی رسم، پر کردن (fill) و سپس نشانه‌ها (markers) خواهد بود.
دو مقدار	رسم از مقادیر داده شده آغاز خواهد شد و سپس به ترتیب پیش‌فرض به باقی‌مانده ادامه خواهد داد. اگر "stroke markers" مشخص شود، فعالیت بعدی رسم، پر کردن (fill) خواهد بود.
سه مقدار	رسم بر اساس مقادیر داده شده انجام خواهد شد.
مقدار پیش‌فرض	این ویژگی را به مقدار پیش‌فرض خود تنظیم کنید. لطفاً به: مراجعه کنید مقدار پیش‌فرض.
ارث‌پذیری	این ویژگی از عنصر والد خود ارث می‌برد. لطفاً به: مراجعه کنید ارث‌پذیری.

مقدار پیش‌فرض:	معمولی
ارث‌پذیری:	بله
انیمیشن ساخت:	پشتیبانی نمی‌شود. لطفاً به: مراجعه کنیدویژگی‌های مرتبط با انیمیشن.
نسخه:	CSS3
آموزش دستور زبان جاوااسکریپت:	object.style.paintOrder="stroke fill"

اعداد در جدول نشان‌دهنده نسخه اولیه مرورگرهایی است که این ویژگی را کاملاً پشتیبانی می‌کنند.

Chrome	Edge	Firefox	Safari	Opera
35.0	17.0	60.0	8.0	22.0