ຖານ CSS grid-row

ການອະທິບາຍແລະການນໍາໃຊ້

grid-row ການກໍານົດຂອງຂະໜາດບັນດາບາດີເຊີຣ໌ໃນການຈັດວາງການກະຈາຍກັບການກະຈາຍຄືກັນພາຍໃນການຈັດວາງການກະຈາຍ, ມັນແມ່ນຄູ່ມັດຂອງບັນດາບາດີເຊີຣ໌ທີ່ຢູ່ທີ່:

ອີງຕາມອີກ:

CSS Tutorial:CSS Grid Layout

ຄວາມຄືບໜ້າ

ຕົວຢ່າງ 1

ເຮັດໃຫ້ "item1" ເລີ່ມຈາກສາຍທີ 1 ແລະຫຼຸດຕາຍສາຍສອງສາຍ:

.item1 {
  grid-row: 1 / span 2;
}

ທໍາອິດຕະຫຼອດຕົວເອງ

ຕົວຢ່າງ 2

ທ່ານສາມາດໃຊ້ຈຳນວນຕາຍສາຍທີ່ຈະຫຼຸດຕາຍສາຍທີ່ຈະຫຼຸດຕາຍສາຍ.

.item1 {
  grid-row: 1 / 3;
}

ທໍາອິດຕະຫຼອດຕົວເອງ

ສັບພາສາ CSS

grid-row: grid-row-start / grid-row-end;

ຄູ່ມັດທາງວັດຖຸ

ຈຳນວນຄູ່ມັດ ການອະທິບາຍ
grid-row-start ກໍານົດຈຸດເລີ່ມສະແດງບັນດາບາດີເຊີຣ໌.
grid-row-end ກໍານົດຈຸດຢຸດສະແດງບັນດາບາດີເຊີຣ໌ທີ່ຢູ່ໃນຈຸດຕາຍສາຍຫຼືຫຼາຍສາຍຫຼາຍ.

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

ຄູ່ມັດຄວາມຄືດັ່ງກ່າວ: auto / auto
ການຕ້ອງການຮັບປະກອບ: ບໍ່
ການສ້າງອິນລານການ: ສະໜັບສະໜູນ. ບັນປະເສີດຢູ່ທີ່:ປະສົມປະກອບທາງອິນລານການວັດຖຸ.
ສະຖານະ: CSS Grid Layout Module Level 1
ສັບພາສາ JavaScript: object.style.gridRow="2 / span 2"

ການສະໜັບສະໜູນບາດີເຊີຣ໌

ຈຳນວນທີ່ຢູ່ໃນຕາຕະລາງກໍານົດຄວາມສະຫຼາດຂອງການສະໜັບສະໜູນບັນດາບາດີເຊີຣ໌ທຳອິດທີ່ສະໜັບສະໜູນບາດດັ່ງກ່າວ.

Chrome IE / Edge Firefox Safari Opera
57 16 52 10 44