เราสามารถกำหนดความสูงและความกว้างให้กับวัตถุในเว็บเพจได้เช่น

div {
    height: 40px;
    width: 40px;
}

ทุก div ที่อยู่ภายในเว็บเพจจะมีขนาด 40x40 pixel ในกรณีที่มีตัวหนังสือใน div หรือภาพที่มีขนาดใหญ่กว่า 40x40 pixel เราต้องการให้มันแสดงผลได้อย่างไรเราจะใช้คำสั่ง overflow เพื่อจัดการมันได้ โดยเราสามารถแสดงผลได้ทั้งหมด 4 แบบดังนี้

Visible แสดงตัวอักษรที่อยู่ในกล่องทั้งหมด
Hidden ซ่อนตัวอักษรที่ล้นกล่องออกมา
Scroll ใช้ scroll bar แสดงผลตัวอักษรที่ล้นกล่อง
Auto แสดงผลอัตโนมัติ คือถ้ามีข้อความล้นกล่องก็จะแสดง scroll ถ้าไม่มีก็จะแสดงกล่องธรรมดา

รูปแบบการแสดงผลคำสั่ง overflow

div {    
    overflow: auto;
}

คลิกเพื่อทดลองเขียนด้วยตัวเอง

author
นันทวัฒน์ ไชยรัตน์

สวัสดีครับผมเป็นโปรแกรมเมอร์ที่ทำงานมาหลายที่ เปลี่ยนมาหลายสายงานครับเลยพอจะมีประสพการณ์มาเขียนบทความหลายๆเรื่องครับ ผมชอบลองทำอะไรใหม่ๆครับบางครั้งลองไปก็ลืมเลยต้องหาที่จดครับ เลยมาขอจดไว้ที่เว็บนี้ครับ