HTML <picture> ຕາມ

  • ບ່ອນໜ້າທີ່ຫຼັງ <param>
  • ບ່ອນໜ້າຫຼັງ <pre>

ການສະແດງຂອງການນຳໃຊ້

<picture> ອັບປະສານສະແດງຄວາມສະດວກຂອງຜູ້ພັດທະນາເວັບໄຊ, ເພື່ອກະກຽມແຫຼ່ງພາບທີ່ຈະຖືກກຳນົດ.

<picture> ການນຳໃຊ້ທີ່ປະຈຳຂອງປະກອບທີ່ຈະຕອບສະໜອງການອອກແບບທີ່ຕອບສະໜອງ. ທ່ານສາມາດອອກແບບພາບຫຼາຍຄັ້ງເພື່ອກະຈາຍຂະໜາດສະແດງຂອງບັນຊີບັນຍາການ, ທີ່ບໍ່ໃຫ້ພາບອອກແບບຕາມຂະໜາດສະແດງທີ່ຈະຂະຫຍາຍຫຼືຫຼຸດລົງ.

<picture> ປະກອບທີ່ຈະມີສອງອັບປະສານ: ໜຶ່ງຫຼືຫຼາຍ <source> ອັບປະສານ ແລະ <img> ອັບປະສານ.

ບັນຊີບັນຍາການຈະຊອກຫາປະກອບ <source> ທີ່ຕົກລົງກັບຄຳຊອກຫາຂອງການຄຳຊອກຫາທີ່ຈະຕົກລົງກັບຂະໜາດຂອງຂ້ອຍກະດູກສະແດງ, ແລະຈະສະແດງພາບທີ່ຖືກກຳນົດໃນ srcset 属性). <img> ປະກອບທີ່ຈະຖືກໃຊ້ໃຫ້ <picture> ປະກອບທີ່ເປັນຜູ້ລູກສຸດທ້າຍຂອງປະກອບທີ່ຈະຖືກນຳໃຊ້ໃນຕອນທີ່ບໍ່ມີແຜງກົດຂອງ source ທີ່ຕົກລົງ.

ຄຳເຕືອນ:<picture> ປະຕິບັດວຽກງາມຂອງປະກອບ <video> ແລະ <audio> ຄືກັນ. ທ່ານສາມາດກະກຽມແຫຼ່ງທີ່ຫຼາກຫຼາຍ, ແລະແຫຼ່ງທີ່ຈະໃຊ້ຄັ້ງທຳອິດຂອງທາງເລືອກຈະຖືກໃຊ້.

ອີງຕາມອີກຫນື່ງ

HTML ອົງການສອນHTML <picture> ສິ່ງ

CSS ອົງການສອນCSS ການອອກແບບຕອບສະໜອງ - ຮູບພາບ

ຕົວຢ່າງ

<picture> ວິທີການນໍາໃຊ້ອອກຈາກ

<picture>
  <source media="(min-width:650px)" srcset="flowers-1.jpg">
  <source media="(min-width:465px)" srcset="flowers-2.jpg">
  <img src="flowers-3.jpg" alt="Flowers" style="width:auto;">
</picture>

ທ້າທາຍພວກເຈົ້າພວກເຮົາ

ຜົນງານທາງວັດສະດຸທົ່ວໄປ

<picture> ອອກຈາກຍັງມີການສະໜັບສະໜູນ ຜົນງານທາງວັດສະດຸທົ່ວໄປ HTML.

ຜົນງານທາງວັດສະດຸ

<picture> ອອກຈາກຍັງມີການສະໜັບສະໜູນ ຜົນງານທາງວັດສະດຸ HTML.

ການສະໜັບສະໜູນຕົວເລື່ອງ

ຈຳນວນຕົວເລກໃນຕາລະບັນຍັດ ໄດ້ກ່າວວ່າ ການສະໜັບສະໜູນທີ່ສຸດຂອງອອກຈາກອອກຈາກ

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
38.0 13.0 38.0 9.1 25.0
  • ບ່ອນໜ້າທີ່ຫຼັງ <param>
  • ບ່ອນໜ້າຫຼັງ <pre>