Computer >> บทช่วยสอนคอมพิวเตอร์ >  >> การเขียนโปรแกรม >> JavaScript

จัดตำแหน่งข้อความแนวตั้งกึ่งกลางใน Block Element ด้วย HTML/CSS

ใช้ Flexbox (แนะนำ)

.container {
    display: flex;
    align-items: center; /* จัดกึ่งกลางแนวตั้ง */
    justify-content: center; /* จัดกึ่งกลางแนวนอน (ถ้าต้องการ) */
    height: 100px; /* ต้องมีความสูง */
}

ทางเลือกเก่า (Vendor Prefixes)

.container {
    display: -moz-box;
    -moz-box-align: center;
    display: -webkit-box;
    -webkit-box-align: center;
}

Flexbox เป็นมาตรฐานสมัยใหม่ รองรับทุกเบราว์เซอร์สมัยใหม่ ใช้วิธีนี้แทน