หน้าส่วนใหญ่ในปัจจุบันถูกจัดวางโดยใช้เลเยอร์ (div) ดังนั้นปัญหาในการจัดตำแหน่งไซต์ให้อยู่ตรงกลางของหน้าต่างเบราว์เซอร์จึงลดลงเหลือแค่การจัดวางเลเยอร์ให้อยู่ตรงกลางที่กำหนดความกว้างของพื้นที่ที่มองเห็นได้ของหน้า เพื่อให้มันอยู่ในตำแหน่งตรงกลางของหน้าต่าง จำเป็นต้องตั้งค่าที่เหมาะสมสำหรับองค์ประกอบหลักหรือสำหรับบล็อกนี้เอง
มันจำเป็น
ความรู้พื้นฐานของภาษา HTML และ CSS CSS
คำแนะนำ
ขั้นตอนที่ 1
วางเลเยอร์ที่คุณต้องการวางที่กึ่งกลางของหน้าต่าง ระหว่างส่วนเปิดและปิดของแท็กตรงกลาง หากคุณต้องการทำเพียงแค่ใช้วิธีการของภาษา HTML (ภาษามาร์กอัป HyperText - "ภาษามาร์กอัปไฮเปอร์เท็กซ์"). เราจะถือว่าพาเรนต์ของเลเยอร์ที่กำหนดเส้นขอบของหน้านั้นเป็นเนื้อหาของเพจนี้ โค้ด HTML เวอร์ชันที่ง่ายที่สุดที่ใช้แท็กตรงกลางในกรณีนี้อาจมีลักษณะดังนี้:
หน้าศูนย์
ข้อความหน้า
ขั้นตอนที่ 2
หากคุณต้องการใช้ CSS (Cascading Style Sheets) เพื่อจัดตำแหน่งหน้าให้อยู่ตรงกลาง ให้ใช้การปรับขนาดอัตโนมัติของช่องว่างภายในจากขอบของหน้าต่างเบราว์เซอร์ ขนาดระยะขอบใน CSS กำหนดโดยพารามิเตอร์ระยะขอบ นำแท็กตรงกลางออกจากตัวอย่างก่อนหน้าและเพิ่มพารามิเตอร์ระยะขอบเป็น 0 อัตโนมัติไปยังแอตทริบิวต์ style ของเลเยอร์ที่กำหนดความกว้างของหน้า
หน้าศูนย์
ข้อความหน้า
ขั้นตอนที่ 3
แน่นอน คำจำกัดความของสไตล์สามารถนำออกจากแอตทริบิวต์ style และวางไว้ในไฟล์ภายนอกหรือในส่วนหัวของเอกสาร (ระหว่างแท็กและ) ในกรณีนี้ รหัสเดียวกันจะมีลักษณะดังนี้:
หน้าศูนย์
#pageFrame {
ความกว้าง: 700px;
ความสูง: 400px;
พื้นหลัง: # 0BB;
ระยะขอบ: 0 อัตโนมัติ;
}
ข้อความหน้า