Tutorial Pengenalan Reka Letak Halaman Web CSS 7: Dua Lajur dengan Tutorial Asas Berpusat Lebar Tetap

Dalam lajur lebar tetap, kami menggunakan margin:0px auto tetapan ini membolehkan div dipaparkan di tengah Dalam lajur dua lajur, perkara yang perlu dikawal ialah bahagian kiri lajur kiri adalah sama dengan sebelah kanan lajur kanan Oleh itu, menggunakan margin: 0px auto nampaknya tidak dapat mencapai kesan yang lancar Pada masa ini, reka bentuk bersarang diperlukan untuk melengkapkan bekas, dan putar dua div yang dibahagikan kepada dua lajur Dalam bekas, untuk mencapai paparan dua lajur, digabungkan dengan kod di atas, struktur kod XHTML baharu adalah seperti berikut:

<meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <title>Dua lajur dengan lebar tetap berpusat - AA25.CN</title> <style type="text/css"> <!-- #layout { width: 404px; margin-top: 0px; margin-right: auto; margin-bottom: 0px; margin-left: auto; } #left { background-color: #E8F5FE; border: 1px solid #A9C9E2; float: left; height: 300px; width: 200px; } #right { background-color: #F2FDDB; border: 1px solid #A5CF3D; float: left; height: 300px; width: 200px; } --> </style> <div id="layout"> <div id="left">Lajur kiri</div> <div id="right">Lajur kanan</div> </div>