ຄວາມການຄົ້ນຫາ paint-order

定义和用法

paint-order 属性指定 SVG 元素或文本的绘制顺序。

注意:对于文本元素,只能更改描边(stroke)和填充(fill)的顺序,因为标记(markers)不适用。

实例

例子 1

更改 SVG 元素的绘制顺序:

circle {
  paint-order: stroke fill;
}

亲自试一试

例子 2

更改带有彩虹渐变填充的 SVG 元素的绘制顺序:

text {
  paint-order: stroke fill;
}

亲自试一试

CSS 语法

paint-order: normal|one value|ສອງຄູ່ມົງຄວາມຄືດ|ສາມຄູ່ມົງຄວາມຄືດ|initial|inherit;

属性值

描述
normal 默认值。绘制顺序为填充、描边、标记。
one value

ການຕັ້ງການຈະເລີ່ມຈາກຄູ່ມົງຄວາມຄືດທຳອິດ, ແລະຕາມລຳດັບມາດຕະການທຳອິດຕໍ່ມາ.

如果仅指定 "stroke",则下一个绘制活动是填充(fill),然后是标记(markers)。

ສອງຄູ່ມົງຄວາມຄືດ

ການຕັ້ງການຈະເລີ່ມຈາກຄູ່ມົງຄວາມຄືດທຳອິດ, ແລະຕາມລຳດັບມາດຕະການທຳອິດຕໍ່ມາ.

ຖ້າມີການກໍານົດ "stroke markers", ການຕັ້ງການສະໜັບສະໜູນຕໍ່ມາຈະເປັນການຕັ້ງການຕັ້ງການຕັດສິນສະໜູນ.

ສາມຄູ່ມົງຄວາມຄືດ ການຕັ້ງການຈະຕາມຄູ່ມົງຄວາມຄືດທຳອິດທີ່ໃຫ້.
initial ຈະຕັດສິນບັນດາປະສົມອາຊີບນີ້ເປັນຄູ່ມົງຄວາມຄືດທຳອິດ. ເບິ່ງ: initial.
inherit ຈະຮັບສະຖານະຂອງປະສົມອາຊີບນີ້ຈາກປະສົມອາຊີບພາຍໃນ. ເບິ່ງ: inherit.

ລາຍລະອຽດດ້ານເຕັກນິກ

ຄູ່ມົງຄວາມຄືດທີ່ມາດຕະການທຳອິດ: normal
ການຮັບສະຖານະຕົວ: yes
ການສ້າງອິນລານການຕັ້ງການ: ບໍ່ສາມາດສະໜັບສະໜູນ. ບັນດາອີງຕາມ:ປະສົມອາຊີບທາງອິນລານການຕັ້ງການ.
ສະຖານະການ: CSS3
ສັບພາສາ JavaScript: object.style.paintOrder="stroke fill"

ການສະໜັບສະໜູນບັນດາຄົນໃຊ້ບັນຊີບັນນາທິການ

ຈຳນວນໃນຕາຕະລາງສະແດງການບໍ່ສາມາດສະໜັບສະໜູນປະສົມອາຊີບນີ້ຈະເປັນບັນດາລຸກບາດທຳອິດທີ່ສະໜັບສະໜູນປະສົມອາຊີບນີ້.

Chrome Edge Firefox Safari Opera
35.0 17.0 60.0 8.0 22.0

ບັນດາໜ້າທີ່

ການສອນ:ການສອນ SVG

ການສອນ:ຮູບພາບ SVG