ຫົວຫຼັກພາສານີ້ oklch() ຂອງ CSS

ການກໍານົດ ແລະ ການນໍາໃຊ້

CSS ໃນ oklch() ຫົວຫຼັກພາສານີ້ຂອງການກໍານົດສີໃນສະພາບສີ OKLCH.

oklch() ຫົວຫຼັກພາສານີ້ຫຼັກການສະແດງ: ທ່ານຕ້ອງພິຈາລະນາຈຳນວນຂອງແສງ/ຄວາມເຈັບຈຳນວນ (L)ທີ່ທ່ານຈະໃຊ້, ຄວາມເຂັ້ມຂອງສີສະຫວ່າງ (C), ແລະສີເອງ (H). ນອກຈາກນັ້ນ, ທ່ານກໍ່ສາມາດເລືອກມາດຕະການສະຫວ່າງຄວາມປອດໄພ (A)ຂອງສີ, ເຊິ່ງສະແດງຄວາມສະຫວ່າງຂອງສີ.

ບົດຕົວ

ການກໍານົດ oklch() ສີ：

/* ສີສະຫວ່າງຄວາມສະຫວ່າງແລະຄວາມກະດີ /
#p1 {background-color: oklch(30% 0.4 150);}
#p2 {background-color: oklch(60% 0.4 150);}
#p3 {background-color: oklch(100% 0.4 150);}
oklch(
oklch(
oklch(
oklch(
oklch(
oklch(
oklch(
oklch(

oklch(

oklch(

oklch(

oklch(from 0 (ຫຼື 0%) ສະແດງວ່າສີດຳ, 1 (ຫຼື 100%) ສະແດງວ່າສີຂະຫຍາຍ. H / Aoklch(from
) ສະແດງວ່າຈຳນວນສີທໍາອິດ.
from

ສະແດງວ່າສີທໍາອິດທີ່ຖືກກໍານົດສຳລັບສີທີ່ຂະຫຍາຍ.

L

ສາມາດໃຊ້ none (ສະແດງວ່າ 0%).
0 (ຫຼື 0%) ສະແດງວ່າສີດຳ, 1 (ຫຼື 100%) ສະແດງວ່າສີຂະຫຍາຍ.

ສຳຄັນ. ສະແດງວ່າຈຳນວນສີ (ຈຳນວນສີຂອງສີ), ສາມາດແມ່ນຈຳນວນຫຼືສິບຕາກຳ.

ຕ້ອງເປັນຈຳນວນຫຼືສິບຕາກຳທີ່ຢູ່ໃນຈຳນວນ -0.4 ຫາ 0.4 ຫຼື 0% ຫາ 100%.

ຈຳນວນສວຍທີ່ນ້ອຍສອງ (0% ຫຼື -0.4) ສະແດງວ່າສີບໍ່ມີຄວາມສະເພາະ.

ສາມາດໃຊ້ none (ສະແດງວ່າ 0%).
H

ສຳຄັນ. ສະແດງວ່າສີຕົ້ນ, ສາມາດແມ່ນສະໄໝຫຼືຈຳນວນອອກຈາກ 0 ຫາ 360.

ສາມາດໃຊ້ none (ສະແດງວ່າ 0deg).
/ A

ຄຳລະບຸ. ສະແດງວ່າຄວາມສະທໍາການທີ່ມີສະເພາະສຳລັບສະຂັບສີ (0% ຫຼື 0) ສະແດງວ່າບໍ່ມີຄວາມທີ່ແຜ່ນ, 100% (ຫຼື 100) ສະແດງວ່າບໍ່ມີຄວາມທີ່ທຳລາຍ.

oklch(

oklch(

ສະແດງວ່າຈຳນວນສີທໍາອິດ.

ສະແດງວ່າຈຳນວນສີທໍາອິດ. from from 0 (ຫຼື 0%) ສະແດງວ່າສີດຳ, 1 (ຫຼື 100%) ສະແດງວ່າສີຂະຫຍາຍ. H / Aoklch(from
) ສະແດງວ່າຈຳນວນສີທໍາອິດ.
ສະແດງວ່າຈຳນວນສີທໍາອິດ. from

color

ສະແດງວ່າຈຳນວນສີທໍາອິດ, ຕໍ່ມາສະແດງວ່າຈຳນວນສີທີ່ຖືກກໍານົດ.
from

ສະແດງວ່າສີທໍາອິດທີ່ຖືກກໍານົດສຳລັບສີທີ່ຂະຫຍາຍ.

L

ສາມາດໃຊ້ none (ສະແດງວ່າ 0%).
0 (ຫຼື 0%) ສະແດງວ່າສີດຳ, 1 (ຫຼື 100%) ສະແດງວ່າສີຂະຫຍາຍ.

ສຳຄັນ. ສະແດງວ່າຈຳນວນສີ (ຈຳນວນສີຂອງສີ), ສາມາດແມ່ນຈຳນວນຫຼືສິບຕາກຳ.

ຕ້ອງເປັນຈຳນວນຫຼືສິບຕາກຳທີ່ຢູ່ໃນຈຳນວນ -0.4 ຫາ 0.4 ຫຼື 0% ຫາ 100%.

ຈຳນວນສວຍທີ່ນ້ອຍສອງ (0% ຫຼື -0.4) ສະແດງວ່າສີບໍ່ມີຄວາມສະເພາະ.

ສາມາດໃຊ້ none (ສະແດງວ່າ 0%).
H

ສຳຄັນ. ສະແດງວ່າສີຕົ້ນ, ສາມາດແມ່ນສະໄໝຫຼືຈຳນວນອອກຈາກ 0 ຫາ 360.

ສາມາດໃຊ້ none (ສະແດງວ່າ 0deg).
/ A

ຄຳລະບຸ. ສະແດງວ່າຄວາມສະທໍາການທີ່ມີສະເພາະສຳລັບສະຂັບສີ (0% ຫຼື 0) ສະແດງວ່າບໍ່ມີຄວາມທີ່ແຜ່ນ, 100% (ຫຼື 100) ສະແດງວ່າບໍ່ມີຄວາມທີ່ທຳລາຍ.

ສາມາດໃຊ້ none (ສະແດງວ່າບໍ່ມີສະທໍາການຜະລິດຄວາມທີ່ແຜ່ນ) ໂດຍກົງ. ຄູ່ມືສົມບູນແມ່ນ 100%.

ຂໍ້ມູນດ້ານເຕັກນິກ

ສະບັບຫົວຂໍ້: CSS Color Module Level 4

ການສະໜັບສະໜູນບັນດາຄົນບັນຈຸ

ຈຳນວນສະບັບໃນຕາລະບັນຍາວ່າເປັນບັນດາຄົນບັນຈຸບັນທຸກທີ່ສະບັບອາດສະແດງບັນຫານີ້

Chrome Edge Firefox Safari Opera
oklch()
111 111 113 15.4 97
ການປະສົມທີ່ມີສະໄໝແລະສິບຕາກຳ
116 116 113 16.2 102

ເວັບໄຊທີ່ກ່ຽວຂ້ອງ

ກ່ຽວກັບການສະແດງຕົວຢ່າງສີ

ກ່ຽວກັບຫົວຂໍ້ບັນຫາ hsl()

ກ່ຽວກັບຫົວຂໍ້ hwb() CSS

ກ່ຽວກັບຫົວຂໍ້ lab() CSS

ກ່ຽວກັບຫົວຂໍ້ lch() CSS

ກ່ຽວກັບຫົວຂໍ້ oklab() CSS