ใช้ CSS เพื่อจัดกึ่งกลางเอกสารด้วยโครงร่างกว้างคงที่

รูปแบบความกว้างคงที่อาจทำได้ยากโดยใช้เบราว์เซอร์บางตัวที่เป็นที่นิยม แต่มีความเป็นไปได้ที่จะมีเพียงไม่กี่บรรทัดเท่านั้น

ต่อไปนี้เป็นอย่างไร

1. สร้างเว็บเพจใหม่ด้วยสไตล์ชีต CSS ในโปรแกรมแก้ไข HTML ของคุณ
2. สร้างองค์ประกอบ div เป็นองค์ประกอบหลักในหน้าเว็บซึ่งคุณจะจัดเก็บทุกอย่างบนหน้าเว็บ
3. ระบุองค์ประกอบ div ว่าเป็นรหัสที่ไม่ซ้ำกันในเพจ
4. เปิดสไตล์ชีต CSS และตั้งความกว้างขององค์ประกอบ div ของคุณ div # main {ความกว้าง: 750px; }
5. เพิ่มระยะขอบโดยอัตโนมัติเพื่อให้ตรงกลาง div ของคุณ div # main {ความกว้าง: 750px; margin-left: auto; ขอบขวา: อัตโนมัติ}
6. หากต้องการแก้ไขปัญหานี้สำหรับ Netscape 4 และ IE 4 - 6 ( โหมดที่ไม่ชอบมาพากล ) จะเป็นการเพิ่มข้อความลงบนร่างกาย body {text-align: center; }
7. แต่จากนั้นข้อความทั้งหมดภายในเป็นศูนย์กลางเพื่อจัดตำแหน่งข้อความใน #main div ใหม่โดยเพิ่ม text-align: left; ในนั้น. div # main {ความกว้าง: 750px; margin-left: auto; ขอบขวา: อัตโนมัติ; text-align: left; }
8. บันทึกหน้าเว็บและสไตล์ชีตของคุณ
9. ทดสอบในเว็บเบราเซอร์หลายเว็บ

ปลาย

การทำเช่นนี้จะเน้นที่ช่องเค้าโครง แต่ไม่ใช่เนื้อหาภายใน ใช้ text-align เพื่อจัดตำแหน่งเนื้อหาภายใน