ຄວາມສະແດງ row-gap
ການກໍານົດ ແລະ ການນໍາໃຊ້
ບັນດາລັກສະນະ row-gap ກໍານົດຄວາມຄາຍລະຫວ່າງສາຍໃນການຈັດວາງບໍລິໂສມຸດພະຍາຍາມ ຫຼື ແກ່ງ.
ບັນດາລັກສະນະ row-gap ກ່ອນແມ່ນ grid-row-gap.
ບໍ່ມີການໝາຍ
CSS ການສອນCSS ການຈັດວາງແກ່ງ
CSS ການສອນCSS ການຈັດວາງບໍລິໂສມຸດພະຍາຍາມ
ປະກາດຂອງ CSSບັນດາລັກສະນະ gap
ປະກາດຂອງ CSSບັນດາລັກສະນະ column-gap
ຄວາມຈຳນວນ
ຕົວຢ່າງ 1
ກໍານົດຄວາມຄາຍ 50 ຕາມລະຫວ່າງສາຍແກ່ງ:
#grid-container {
display: grid;
row-gap: 50px;
}
ຕົວຢ່າງ 2: ການຈັດວາງບໍລິໂສມຸດພະຍາຍາມ
ກໍານົດຄວາມຄາຍລະຫວ່າງສາຍໃນການຈັດວາງບໍລິໂສມຸດພະຍາຍາມ 70px:
#flex-container {
display: flex;
row-gap: 70px;
}
ສັນຍານ CSS
row-gap: length|normal|initial|inherit;
| ຄູ່ກະຈາຍ | ອະທິບາຍ |
|---|---|
| length | ກໍານົດຄວາມຄາຍລະຫວ່າງສາຍຈາກຄວາມຍາວຫຼືສິບປີເຊິ່ງ. |
| normal | ຄູ່ກະຈາຍຄາດກໍາ. ກໍານົດຄວາມຄາຍລະຫວ່າງສາຍ. |
| initial | ຕັດສິນບັນດາລັກສະນະດັ່ງກ່າວເປັນຄູ່ກະຈາຍຄາດກໍາ. ເບິ່ງ: initial. |
| inherit | ຖືກສ້າງຂຶ້ນຈາກປະກອບອົງປະກອບພວກເພື່ອນ. ເບິ່ງ: inherit. |
ລາຍລະອຽດດ້ານເຕັກນິກ
| ຄູ່ກະຈາຍຄາດກໍາ: | normal |
|---|---|
| ການຖືກສ້າງຂຶ້ນ: | ບໍ່ |
| ການສ້າງວີລະບາກ: | ສະໜັບສະໜູນ. ບັນປະເທດ:ບັນດາລັກສະນະວີລະບາກ. |
| ສະຖານະການ: | CSS Box Alignment Module Level 3 |
| JavaScript ສັນຍານ: | object.style.rowGap="50px" |
ການສະໜັບສະໜູນບັນນາທິການບັນນາທິການ
ຈຳນວນບາງບັນນາທິການໃນຕາມການປະກອບການບາງບັນນາທິການທີ່ສົມບູນສະໜັບສະໜູນຂອງບັນນາທິການດັ່ງກ່າວ.
| ການຈັດວາງ | Chrome | IE / Edge | Firefox | Safari | Opera |
|---|---|---|---|---|---|
| ໃນແກ່ງ | 66 | 16 | 61 | 12 | 53 |
| ໃນບໍລິໂສມຸດພະຍາຍາມ | 84 | 84 | 63 | 14.1 | 70 |
