css melebihi paparan bahagian

Pengendalian limpahan dalam CSS merujuk kepada cara mengendalikan situasi apabila kandungan dalam elemen melebihi saiz bekasnya. Biasanya, penyemak imbas secara automatik akan melaraskan saiz dan kedudukan kandungan dalam bekas berdasarkan saiz bekas, tetapi kadangkala kita mahu dapat mengawal kesan paparan apabila kandungan melebihi bekas. Artikel ini akan memperkenalkan teknik dan kaedah tentang cara mengendalikan paparan berlebihan dalam CSS.

1. Atribut limpahan

Dalam CSS, anda boleh menggunakan atribut limpahan untuk mengendalikan limpahan kandungan dalam bekas. Atribut ini mempunyai empat nilai berikut:

1. kelihatan: nilai lalai. Membenarkan kandungan melimpahi bekas dan dipaparkan di luar bekas.
2. tersembunyi: Menunjukkan bahawa kandungan akan disembunyikan di luar bekas. Dalam erti kata lain, nilai ini memotong kandungan limpahan, menjadikannya tidak kelihatan.
3. skrol: Menunjukkan bahawa kandungan akan menatal dalam bekas. Nilai ini mencipta bar skrol dalam bekas, membenarkan kandungan ditatal.
4. auto: Jika kandungan limpahan boleh dimuatkan dalam bekas, tiada pemprosesan akan dilakukan. Jika kandungan limpahan tidak muat, bar skrol akan dipaparkan.

2. Atribut limpahan teks

Atribut limpahan teks boleh mengawal cara mengendalikan teks limpahan sebaris atau elemen sebaris elemen boleh Melengkapkan pembalut baris automatik teks.

text-overflow mempunyai tiga nilai berikut:

1. klip: nilai lalai. Apabila teks melebihi bekas, ia akan dipangkas terus.
2. elipsis: Apabila teks melebihi bekas, ia akan diwakili oleh elipsis.
3. rentetan: Elips tersuai. Anda boleh menggunakan sifat ini untuk menyesuaikan elips untuk sebarang rentetan.

3. Atribut ruang putih

Atribut ruang putih boleh mengawal sama ada teks dibalut secara automatik, sama ada paparan teks limpahan mengabaikan "ruang" dan cara mengendalikan "ruang" ".

Atribut ini mempunyai tiga nilai berikut:

1. normal: nilai lalai. Menunjukkan bahawa teks akan dibalut secara automatik dan "ruang" tambahan akan diabaikan.
2. nowrap: Menunjukkan bahawa teks tidak akan membalut secara automatik Apabila teks melebihi lebar bekas, ia akan terus melimpahi bekas.
3. pra-bungkus: Menunjukkan mengekalkan "ruang" tetapi mendayakan pembalut baris automatik.

4. Susun atur lajur berbilang lajur

Menggunakan reka letak berbilang lajur CSS, kandungan dalam bekas boleh dibahagikan kepada berbilang lajur untuk paparan, mengelakkan situasi di mana a satu lajur kandungan melebihi bekas .

Anda boleh menggunakan atribut kiraan lajur untuk mentakrifkan bilangan lajur dalam berbilang lajur;

5. Paksa elemen sebaris (seperti gambar) disusun secara mendatar

Sesetengah elemen ialah elemen peringkat blok secara lalai, seperti gambar (), dan ia akan menduduki barisan yang berasingan. Jika kita ingin meletakkan berbilang imej pada baris yang sama, kita boleh menggunakan display:inline-block untuk menukar elemen ini kepada elemen inline.

Kesimpulan

Artikel ini memperkenalkan beberapa kaedah mengendalikan kandungan limpahan dalam CSS Anda boleh mengawal reka letak dan kesan paparan halaman dengan menggunakan kaedah ini secara rasional. Jika anda ingin mengetahui lebih lanjut mengenai reka letak CSS, sila rujuk dokumentasi yang berkaitan.

Atas ialah kandungan terperinci css melebihi paparan bahagian. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!