HTML CSS ການຈັດການສະຖານີ - width ແລະ max-width

ການນຳໃຊ້ width, max-width ແລະ margin: auto;

ອີງຕາມທີ່ກ່າວໃນຫຼັກສູດກ່ອນ, ປະກອບສະຖານທີ່ທີ່ວົງຈະນຳໃຊ້ວົງທີ່ມີຢູ່ທັງໄກທາງຊ້າຍແລະທາງຊ້າຍ (ທີ່ສາມາດຂຶ້ນຮອດຊ້າຍແລະຊ້າຍຫຼາຍທີ່ສຸດ).

ການກະຕຸບກາງປະກອບສະຖານທີ່ທີ່ວົງ width ຈະປ້ອງກັນໃຫ້ບໍ່ຂຶ້ນຮອດຂ້າງຂອງບັນດາບັນດາບັນດາສະຖານທີ່ຂອງບັນດາບັນດາບັນດາສະຖານທີ່. ແຕ່ຫຼັງຈາກນັ້ນເຈົ້າສາມາດການກະຕຸບກາງແມ່ນ auto ເພື່ອຈັດການປະກອບສະຖານທີ່ຢູ່ບ່ອນກາງຂອງບັນດາບັນດາບັນດາສະຖານທີ່. ປະກອບສະຖານທີ່ຈະນຳໃຊ້ວົງຂອງທີ່ກໍານົດໄວ້, ອາກາດເຫຼືອຈະແບ່ງຢູ່ບ່ອນກາງຂອງການກະຕຸບກາງ:

ລະດັບວົງຂອງ <div> ນີ້ແມ່ນ 500px ແລະການການກະຕຸບກາງແມ່ນ auto。

ຫັງວ່າ:ເມື່ອຫ້ອງບານຍັງບໍ່ຮອດລະດັບວົງຂອງບັນດາປະກອບສະຖານທີ່ນີ້ <div> 会发生问题。浏览器会将水平滚动条添加到页面。

在这种情况下，使用 max-width 可以改善浏览器对小窗口的处理。为了使网站在小型设备上可用，这一点很重要：

这个
元素的最大宽度为 500px，外边距设置为 auto。

提示：请将浏览器窗口的大小调整为小于 500 像素，以查看两个 div 之间的区别！

这是上面两个 div 的例子：

ກໍານົດ

div.ex1 {
  width: 500px;
  margin: auto;
  border: 3px solid #73AD21;
}
div.ex2 {
  max-width: 500px;
  margin: auto;
  border: 3px solid #73AD21;
}

ພະຍາຍາມເອງ