Tutorial pengenalan reka letak halaman web CSS 6: lajur kiri tetap, lebar lajur kanan adaptif_Tutorial asas

Dalam aplikasi praktikal, kadangkala perlu mempunyai lebar tetap lajur kiri dan lajur kanan untuk menyesuaikan secara automatik mengikut saiz tetingkap penyemak imbas Ia adalah mudah dan boleh dilaksanakan untuk melaksanakan kaedah susun atur dalam CSS untuk menetapkan lebar lajur kiri, seperti dalam contoh di atas, kedua-dua lajur kiri dan kanan menggunakan peratusan untuk melaksanakan penyesuaian lebar, dan kami hanya perlu menetapkan lebar lajur kiri kepada nilai tetap, jangan tetapkan sebarang lebar. nilai untuk lajur kanan, dan lajur kanan tidak terapung Kod adalah seperti berikut:

Salin kod Kod adalah seperti berikut:

#kiri {
warna latar: #E8F5FE;
jidar 1px #A9C9E2; > lebar: 200 piksel; 🎜>
Dengan cara ini, lajur kiri akan menunjukkan lebar 100%, dan lajur kanan akan menyesuaikan mengikut saiz tetingkap penyemak imbas.







Lajur kiri dua lajur dibetulkan dan lebar lajur kanan adalah adaptif - AA25.CN

Lajur kiri - tetap (AA25.CN)Lajur kanan - lebar penyesuaian (AA25.CN) <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <title></title> <style type="text/css"> <!-- #left { background-color: #E8F5FE; border: 1px solid #A9C9E2; float: left; height: 300px; width: 200px; } #right { background-color: #F2FDDB; border: 1px solid #A5CF3D; height: 300px; } --> </style> [Ctrl+A Pilih semua Nota: <div id="left">Jika anda perlu memperkenalkan Js luaran, anda perlu memuat semula untuk melaksanakan </div>]<div id="right"></div> Lebar lajur kanan lajur kedua Adaptive sering digunakan di laman web, sama ada lajur kanan atau lajur kiri Kaedahnya sama Anda hanya perlu menukar tulisan dua div dilihat dalam banyak blog semasa, contohnya, templat yang dibuat oleh ramai netizen dalam pjblog mempunyai reka letak ini. Proses pengeluaran tidak akan diterangkan secara terperinci di sini Sila rujuk tutorial sebelumnya: Tutorial Pengenalan Reka Letak Halaman Web CSS 5: Penyesuaian lebar dua lajur, cuma tukar lebar lajur kiri kepada 200px, dan keluarkan lebarnya. dan terapung kiri lajur kanan Itu sahaja. Jika anda masih tidak memahami sesuatu, anda boleh bertanya soalan di bawah atau tinggalkan mesej dalam buku pelawat.