CSS brightness() ຫົວຂໍ້

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

CSS brightness() ຫົວຂໍ້ຕົວເລິກຈະຮັບການດັດແປງຄວາມເຊື່ອມຂອງປຸກ.

  • 0% ຈະເຮັດໃຫ້ພາບສົບສົມ.
  • 100%（ຫຼື 1）ແມ່ນຈຳນວນສະໜອງແບບພາບແບບເດີມ
  • ຈຳນວນທີ່ຫຼາຍກວ່າ 100% ຈະເຮັດໃຫ້ພາບມີຄວາມເຊື່ອມ.
  • ຈຳນວນທີ່ຕ່ຳກວ່າ 100% ຈະເຮັດໃຫ້ພາບຫຼາຍກວ່າ.

ຄວາມປະສົມ

ຕົວຢ່າງ 1

ຈະເຮັດໃຫ້ພາບມີຄວາມເຊື່ອມຫຼາຍກວ່າພາບແບບເດີມຫຼືຫຼາຍກວ່າພາບແບບເດີມ:

#img1 {
  filter: brightness(150%);
}
#img2 {
  filter: brightness(50%);
}

ທົດລອງດຽວຕາມຕົວເລິກ

ຕົວຢ່າງ 2

ຈະ brightness() ແລະ backdrop-filter ການຄົ້ນພົບປະສົມກັນ:

div.transbox {
  background-color: rgba(255, 255, 255, 0.4);
  -webkit-backdrop-filter: brightness(150%);
  backdrop-filter: brightness(150%);
  padding: 20px;
  margin: 30px;
  font-weight: bold;
}

ທົດລອງດຽວຕາມຕົວເລິກ

ສັບສຳນວນ CSS

brightness(amount)
ຈຳນວນ ການອະທິບາຍ
amount

ຄຳລະບຸຄວາມຄວາມເຊື່ອມ. ສາມາດເປັນໂຕຕາມຫຼືສາມາດເປັນຕາມສາມາດ.

0% ຈະເຮັດໃຫ້ປຸກຄົນສົບສົມ.

ຈຳນວນທີ່ຫຼາຍກວ່າ 100% ຈະເຮັດໃຫ້ພາບມີຄວາມເຊື່ອມ.

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

ສະຖານະ: CSS Filter Effects Module Level 1

ການສະໜັບສະໜູນບັນດາສະໝອງ

ຈຳນວນໃນຕາຕະລາງສະແດງວ່າ ລະບົບສະໝອງທີ່ເປັນຜູ້ສະໜັບສະໜູນຫົວຂໍ້ນີ້ຄັ້ງທຳອິດ.

Chrome Edge Firefox Safari Opera
18 12 35 6 15

ບັນດາໜ້າທີ່ກ່ຽວຂ້ອງ

సూచనలు:CSS ఫిల్టర్ అట్రిబ్యూట్

సూచనలు:CSS బ్లర్() ఫంక్షన్

సూచనలు:CSS contrast() ຫົວຂໍ້

సూచనలు:CSS drop-shadow() ຫົວຂໍ້

సూచనలు:CSS grayscale() ຫົວຂໍ້

సూచనలు:CSS hue-rotate() ຫົວຂໍ້

సూచనలు:CSS invert() ຫົວຂໍ້

సూచనలు:CSS opacity() ຫົວຂໍ້

సూచనలు:CSS saturate() 函数

సూచనలు:CSS సెపియా() ఫంక్షన్