Bagaimana untuk Membuat Div Menatal Menegak dalam CSS?

Mencipta Div dengan Tatal Menegak dalam CSS

Apabila mencipta div yang anda mahu boleh tatal, adalah penting untuk memahami sifat limpahan . Secara lalai, limpahan: auto membenarkan kandungan melangkaui sempadan div dan mencipta bar skrol untuk kedua-dua paksi mendatar dan menegak. Untuk mengehadkan penatalan kepada paksi menegak sahaja, anda perlu menggunakan limpahan-y sebaliknya.

Limpahan-y: Tatal

Menggunakan limpahan-y: tatal memaksa menegak bar skrol untuk muncul, tidak kira sama ada kandungan melebihi ketinggian div. Ini berguna apabila anda ingin memastikan bar skrol menegak sentiasa kelihatan, walaupun kandungan tidak melebihi ketinggian div.

Limpahan-y: Auto

Jika anda mahu bar skrol menegak muncul hanya apabila kandungan melebihi ketinggian div, gunakan limpahan-y: auto. Ini membolehkan kandungan memecah ke baris seterusnya secara automatik apabila ia mencapai penghujung div, menghalang bar skrol mendatar daripada muncul. Walau bagaimanapun, jika kandungan melebihi ketinggian div, bar skrol menegak akan kelihatan.

Kod Contoh

Untuk mencipta div yang hanya boleh ditatal secara menegak, gunakan CSS berikut:

<pre class="brush:php;toolbar:false">
div {
  overflow-y: auto;
  height: 400px;
}

Kod ini akan menghasilkan div yang membenarkan tatal menegak apabila kandungan melebihi ketinggian div sebanyak 400px, sambil menghalang penatalan mendatar.

Atas ialah kandungan terperinci Bagaimana untuk Membuat Div Menatal Menegak dalam CSS?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!