คุณสมบัติ padding-block-end
คุณสมบัติ padding-block-end กำหนดการเว้นช่องว่างภายในสุดท้าย
ขององค์ประกอบตามแกนบล็อก (แนวตั้ง)
ไวยากรณ์
ตัวเลือก {
padding-block-end: ขนาด;
}
ตัวอย่าง
มาตั้งค่าการเว้นช่องว่างภายในสุดท้ายสำหรับองค์ประกอบลูก
ตามแกนบล็อกเป็น 20px:
<div>
<p>ข้อความ</p>
</div>
div {
width: 400px;
height: 200px;
border: 1px solid black;
}
p {
padding-block-end: 20px;
width: 100px;
height: 50px;
border: 1px solid red;
}
:
ตัวอย่าง
และตอนนี้มาตั้งค่าการเว้นช่องว่างภายในสุดท้ายสำหรับองค์ประกอบลูก
ตามแกนบล็อกเป็น 20%:
<div>
<p>ข้อความ</p>
</div>
div {
width: 400px;
height: 200px;
border: 1px solid black;
}
p {
padding-block-end: 20%;
width: 100px;
height: 50px;
border: 1px solid red;
}
:
ดูเพิ่มเติม
-
คุณสมบัติ
padding-block-start,
ซึ่งกำหนดการเว้นช่องว่างภายในเริ่มต้นขององค์ประกอบตามแกนบล็อก -
คุณสมบัติ
padding-inline-end,
ซึ่งกำหนดการเว้นช่องว่างภายในสุดท้ายขององค์ประกอบตามแกนอินไลน์ -
คุณสมบัติ
padding-inline-start,
ซึ่งกำหนดการเว้นช่องว่างภายในเริ่มต้นขององค์ประกอบตามแกนอินไลน์ -
คุณสมบัติ
padding,
ซึ่งกำหนดการเว้นช่องว่างภายใน -
คุณสมบัติ
margin-bottom,
ซึ่งกำหนดการเว้นระยะห่างภายนอกด้านล่าง -
คุณสมบัติ
margin-left,
ซึ่งกำหนดการเว้นระยะห่างภายนอกด้านซ้าย -
คุณสมบัติ
margin-right,
ซึ่งกำหนดการเว้นระยะห่างภายนอกด้านขวา -
คุณสมบัติ
margin,
ซึ่งเป็นคุณสมบัติแบบย่อสำหรับการเว้นระยะห่างภายนอก