Bahagian lebihan css tidak dipaparkan

Dalam reka bentuk web, kami sering menghadapi masalah: apabila kandungan melebihi lebar atau ketinggian antara muka, sebahagian daripada kandungan tidak boleh dipaparkan. Ini kerana dalam kebanyakan kes, penyemak imbas menyembunyikan kandungan di luar skop secara lalai untuk memastikan halaman bersih dan cantik. Namun, kadang-kadang kita mahu bahagian yang berlebihan itu dipaparkan.

Ini memerlukan penggunaan sifat limpahan CSS. Sifat ini menunjukkan cara mengendalikan kandungan apabila ia melebihi had. Ia mempunyai empat nilai:

1. kelihatan: Kandungan yang melebihi sempadan dipaparkan dan tidak akan disembunyikan.
2. tersembunyi: Kandungan di luar sempadan disembunyikan.
3. skrol: Kandungan yang melebihi sempadan dipaparkan dan bar skrol muncul.
4. auto: Kandungan yang melebihi sempadan secara automatik memilih bar skrol atau menyembunyikannya mengikut keperluan.

Dengan menetapkan atribut limpahan, kandungan berlebihan boleh dipaparkan. Di bawah ini kami memperkenalkan penggunaan khusus secara terperinci.

1. Paparkan kandungan limpahan mendatar

Apabila lebar kandungan sesuatu elemen melebihi lebar bekasnya, limpahan mendatar akan berlaku. Untuk memaparkan bahagian lebihan, anda perlu menetapkan gaya CSS berikut untuk bekas:

overflow-x: scroll; /*出现水平滚动条*/
whitespace: nowrap; /*禁止换行*/

Dengan cara ini, apabila lebar bekas tidak mencukupi, kandungan lebihan boleh ditatal dan dipaparkan secara automatik.

2. Paparkan kandungan limpahan menegak

Apabila ketinggian kandungan unsur melebihi ketinggian bekasnya, limpahan menegak akan berlaku. Untuk memaparkan bahagian lebihan, anda perlu menetapkan gaya CSS berikut untuk bekas:

overflow-y: scroll; /*出现垂直滚动条*/

Dengan cara ini, kandungan lebihan boleh menatal secara automatik apabila ketinggian bekas tidak mencukupi.

3. Paparkan kandungan limpahan mendatar dan menegak pada masa yang sama

Jika elemen mempunyai limpahan mendatar dan menegak, anda perlu menggabungkan dua kaedah di atas. Kaedah khusus adalah seperti berikut:

overflow: scroll; /*同时出现水平、垂直滚动条*/

Dengan cara ini, semua kandungan berlebihan boleh dipaparkan.

4. Biarkan kandungan limpahan melimpah ke dalam bekas

Kadangkala, reka bentuk halaman memerlukan lebihan kandungan untuk dipaparkan. Pada masa ini, kita boleh menggunakan "keratan limpahan" CSS untuk mencapai matlamat ini. Kaedah khusus ialah:

overflow: visible; /*允许容器外的内容显示出来*/

Dengan cara ini, semua kandungan yang berlebihan boleh dipaparkan tanpa sebarang sekatan.

Perlu diambil perhatian bahawa apabila menggunakan pemangkasan limpahan, kandungan yang berlebihan mungkin meliputi elemen lain, menjejaskan keindahan halaman. Oleh itu, penjagaan khas diperlukan semasa menggunakannya.

Untuk meringkaskan, dengan menetapkan atribut limpahan CSS, anda boleh memaparkan sebahagian daripada kandungan di luar bekas, yang sangat berguna dalam reka bentuk halaman. Nilai atribut yang berbeza boleh memenuhi keperluan yang berbeza, dan pada masa yang sama, perhatian harus diberikan kepada kesan pada estetika halaman. Saya berharap melalui pengenalan artikel ini, pembaca dapat menguasai penggunaan atribut limpahan dengan lebih baik dan membawa lebih banyak keindahan dan fungsi kepada reka bentuk halaman.

Atas ialah kandungan terperinci Bahagian lebihan css tidak dipaparkan. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!