ຂ້າມໄປຫາເນື້ອຫາຕົ້ນຕໍ ຂ້າມໄປຫາການນຳທາງເອກະສານ
Check
in English

ຕົວທ່ອງເວັບແລະອຸປະກອນ

ຮຽນຮູ້ກ່ຽວກັບຕົວທ່ອງເວັບແລະອຸປະກອນ, ຈາກທີ່ທັນສະໄຫມຈົນເຖິງເກົ່າ, ທີ່ໄດ້ຮັບການສະຫນັບສະຫນູນໂດຍ Bootstrap, ລວມທັງ quirks ແລະແມງໄມ້ທີ່ຮູ້ຈັກສໍາລັບແຕ່ລະຄົນ.

ຕົວທ່ອງເວັບທີ່ຮອງຮັບ

Bootstrap ສະຫນັບສະຫນູນການປ່ອຍ ຫລ້າສຸດ, ຫມັ້ນຄົງ ຂອງຕົວທ່ອງເວັບແລະເວທີທີ່ສໍາຄັນທັງຫມົດ.

ຕົວທ່ອງເວັບທາງເລືອກທີ່ໃຊ້ WebKit, Blink, ຫຼື Gecko ເວີຊັນຫຼ້າສຸດ, ບໍ່ວ່າຈະໂດຍກົງຫຼືຜ່ານ API ເບິ່ງເວັບຂອງເວທີ, ບໍ່ໄດ້ຮັບການສະຫນັບສະຫນູນຢ່າງຊັດເຈນ. ຢ່າງໃດກໍຕາມ, Bootstrap ຄວນ (ໃນກໍລະນີຫຼາຍທີ່ສຸດ) ສະແດງແລະເຮັດວຽກຢ່າງຖືກຕ້ອງໃນຕົວທ່ອງເວັບເຫຼົ່ານີ້ເຊັ່ນດຽວກັນ. ຂໍ້ມູນການສະຫນັບສະຫນູນສະເພາະແມ່ນສະຫນອງໃຫ້ຂ້າງລຸ່ມນີ້.

ທ່ານ​ສາ​ມາດ​ຊອກ​ຫາ​ໄລ​ຍະ​ສະ​ຫນັບ​ສະ​ຫນູນ​ຂອງ​ພວກ​ເຮົາ​ຂອງ​ຕົວ​ທ່ອງ​ເວັບ​ແລະ​ສະ​ບັບ​ຂອງ​ພວກ​ເຂົາ ​ໃນ.browserslistrc file ​:

# https://github.com/browserslist/browserslist#readme

>= 0.5%
last 2 major versions
not dead
Chrome >= 60
Firefox >= 60
Firefox ESR
iOS >= 12
Safari >= 12
not Explorer <= 11

ພວກເຮົາໃຊ້ Autoprefixer ເພື່ອຈັດການການສະຫນັບສະຫນູນຂອງຕົວທ່ອງເວັບທີ່ຕັ້ງໃຈຜ່ານຄໍານໍາຫນ້າ CSS, ເຊິ່ງໃຊ້ Browserslist ເພື່ອຈັດການສະບັບຂອງຕົວທ່ອງເວັບເຫຼົ່ານີ້. ປຶກສາຫາລືເອກະສານຂອງເຂົາເຈົ້າສໍາລັບວິທີການປະສົມປະສານເຄື່ອງມືເຫຼົ່ານີ້ເຂົ້າໃນໂຄງການຂອງທ່ານ.

ອຸປະກອນມືຖື

ໂດຍທົ່ວໄປແລ້ວ, Bootstrap ສະຫນັບສະຫນູນເວີຊັນຫຼ້າສຸດຂອງຕົວທ່ອງເວັບເລີ່ມຕົ້ນຂອງແຕ່ລະແພລະຕະຟອມທີ່ສໍາຄັນ. ໃຫ້ສັງເກດວ່າຕົວທ່ອງເວັບຂອງຕົວແທນ (ເຊັ່ນ Opera Mini, Opera Mobile's Turbo mode, UC Browser Mini, Amazon Silk) ແມ່ນບໍ່ຮອງຮັບ.

Chrome Firefox Safari Android Browser & WebView
Android ສະຫນັບສະຫນູນ ສະຫນັບສະຫນູນ v6.0+
iOS ສະຫນັບສະຫນູນ ສະຫນັບສະຫນູນ ສະຫນັບສະຫນູນ

ຕົວທ່ອງເວັບຂອງ desktop

ເຊັ່ນດຽວກັນ, ເວີຊັນຫຼ້າສຸດຂອງຕົວທ່ອງເວັບ desktop ສ່ວນໃຫຍ່ໄດ້ຮັບການສະຫນັບສະຫນູນ.

Chrome Firefox Microsoft Edge Opera Safari
Mac ສະຫນັບສະຫນູນ ສະຫນັບສະຫນູນ ສະຫນັບສະຫນູນ ສະຫນັບສະຫນູນ ສະຫນັບສະຫນູນ
Windows ສະຫນັບສະຫນູນ ສະຫນັບສະຫນູນ ສະຫນັບສະຫນູນ ສະຫນັບສະຫນູນ

ສໍາລັບ Firefox, ນອກເຫນືອຈາກການປ່ອຍຄວາມຫມັ້ນຄົງປົກກະຕິຫລ້າສຸດ, ພວກເຮົາຍັງສະຫນັບສະຫນູນການ ຂະຫຍາຍການສະຫນັບສະຫນູນ (ESR) ຮຸ່ນຫຼ້າສຸດຂອງ Firefox.

ໂດຍບໍ່ເປັນທາງການ, Bootstrap ຄວນເບິ່ງແລະປະຕິບັດຕົວພຽງພໍໃນ Chromium ແລະ Chrome ສໍາລັບ Linux, ແລະ Firefox ສໍາລັບ Linux, ເຖິງແມ່ນວ່າພວກເຂົາບໍ່ໄດ້ຮັບການສະຫນັບສະຫນູນຢ່າງເປັນທາງການ.

Internet Explorer

ບໍ່ຮອງຮັບ Internet Explorer. ຖ້າທ່ານຕ້ອງການສະຫນັບສະຫນູນ Internet Explorer, ກະລຸນາໃຊ້ Bootstrap v4.

Modals ແລະ dropdowns ໃນມືຖື

ລົ້ນ ແລະ ເລື່ອນ

ການສະຫນັບສະຫນູນສໍາລັບ ອົງ overflow: hidden;ປະ <body>ກອບແມ່ນຂ້ອນຂ້າງຈໍາກັດໃນ iOS ແລະ Android. ເພື່ອເຮັດສິ່ງນີ້, ເມື່ອທ່ານເລື່ອນຜ່ານທາງເທິງຫຼືລຸ່ມຂອງ modal ໃນຕົວທ່ອງເວັບຂອງອຸປະກອນເຫຼົ່ານັ້ນ, <body>ເນື້ອຫາຈະເລີ່ມເລື່ອນລົງ. ເບິ່ງ ຂໍ້ບົກພ່ອງຂອງ Chrome #175502 (ແກ້ໄຂໃນ Chrome v40) ແລະ ຂໍ້ບົກພ່ອງ WebKit #153852 .

ຊ່ອງຂໍ້ມູນ iOS ແລະເລື່ອນ

ໃນຖານະເປັນ iOS 9.2, ໃນຂະນະທີ່ modal ເປີດ, ຖ້າການສໍາພັດເບື້ອງຕົ້ນຂອງ gesture ເລື່ອນແມ່ນຢູ່ໃນຂອບເຂດຂອງຂໍ້ຄວາມ <input>ຫຼື a <textarea>, <body>ເນື້ອໃນພາຍໃຕ້ modal ຈະຖືກເລື່ອນແທນທີ່ຈະເປັນ modal ຕົວຂອງມັນເອງ. ເບິ່ງ WebKit bug #153856 .

ອົງ ປະ .dropdown-backdropກອບດັ່ງກ່າວບໍ່ໄດ້ໃຊ້ໃນ iOS ໃນ nav ເນື່ອງຈາກຄວາມສັບສົນຂອງ z-indexing. ດັ່ງນັ້ນ, ເພື່ອປິດ dropdowns ໃນ navbars, ທ່ານຕ້ອງໄດ້ໂດຍກົງຄລິກອົງປະກອບ dropdown (ຫຼື ອົງປະກອບອື່ນໆທີ່ຈະ fire event ຄລິກໃນ iOS ).

ການຊູມຂອງຕົວທ່ອງເວັບ

ການຊູມຫນ້າຢ່າງຫຼີກລ່ຽງບໍ່ໄດ້ສະເຫນີການສະແດງຜົນປອມໃນບາງອົງປະກອບ, ທັງໃນ Bootstrap ແລະສ່ວນທີ່ເຫຼືອຂອງເວັບ. ອີງຕາມບັນຫາ, ພວກເຮົາອາດຈະສາມາດແກ້ໄຂໄດ້ (ຄົ້ນຫາກ່ອນແລະຫຼັງຈາກນັ້ນເປີດບັນຫາຖ້າຕ້ອງການ). ຢ່າງໃດກໍຕາມ, ພວກເຮົາມີແນວໂນ້ມທີ່ຈະບໍ່ສົນໃຈສິ່ງເຫຼົ່ານີ້ຍ້ອນວ່າພວກເຂົາມັກຈະບໍ່ມີການແກ້ໄຂໂດຍກົງນອກເຫນືອຈາກການແກ້ໄຂບັນຫາ hacky.

ຜູ້ກວດສອບ

ເພື່ອໃຫ້ປະສົບການທີ່ດີທີ່ສຸດທີ່ເປັນໄປໄດ້ກັບຕົວທ່ອງເວັບເກົ່າແລະ buggy, Bootstrap ໃຊ້ CSS browser hacks ໃນຫຼາຍໆບ່ອນເພື່ອເປົ້າຫມາຍ CSS ພິເສດໃຫ້ກັບບາງຮຸ່ນຂອງຕົວທ່ອງເວັບເພື່ອເຮັດວຽກກັບແມງໄມ້ໃນຕົວທ່ອງເວັບຂອງຕົນເອງ. ການແຮັກເຫຼົ່ານີ້ເຂົ້າໃຈໄດ້ເຮັດໃຫ້ຜູ້ກວດສອບ CSS ຈົ່ມວ່າບໍ່ຖືກຕ້ອງ. ຢູ່ໃນສະຖານທີ່ສອງຢ່າງ, ພວກເຮົາຍັງໃຊ້ຄຸນສົມບັດ CSS ທີ່ມີເລືອດອອກທີ່ຍັງບໍ່ທັນໄດ້ມາດຕະຖານຢ່າງເຕັມສ່ວນ, ແຕ່ເຫຼົ່ານີ້ຖືກນໍາໃຊ້ຢ່າງດຽວສໍາລັບການເພີ່ມປະສິດທິພາບກ້າວຫນ້າ.

ຄໍາເຕືອນການຢືນຢັນເຫຼົ່ານີ້ບໍ່ສໍາຄັນໃນການປະຕິບັດເພາະວ່າສ່ວນທີ່ບໍ່ແມ່ນ hacky ຂອງ CSS ຂອງພວກເຮົາມີຄວາມຖືກຕ້ອງຢ່າງເຕັມສ່ວນແລະສ່ວນ hacky ບໍ່ໄດ້ແຊກແຊງການເຮັດວຽກທີ່ເຫມາະສົມຂອງສ່ວນທີ່ບໍ່ແມ່ນ hacky, ດັ່ງນັ້ນເປັນຫຍັງພວກເຮົາເຈດຕະນາບໍ່ສົນໃຈຄໍາເຕືອນໂດຍສະເພາະເຫຼົ່ານີ້.

ເອກະສານ HTML ຂອງພວກເຮົາເຊັ່ນດຽວກັນມີບາງຄໍາເຕືອນການກວດສອບ HTML ທີ່ບໍ່ສໍາຄັນແລະບໍ່ມີຜົນສະທ້ອນອັນເນື່ອງມາຈາກການລວມເອົາການແກ້ໄຂຂອງພວກເຮົາສໍາລັບ ບາງຂໍ້ຜິດພາດ Firefox .