Bagaimana Memaksa Pemisahan Talian Dalam Kandungan Sebaris dalam CSS?

Memaksa Pemutus Talian dalam Kandungan Sebaris dalam CSS

Ada kemungkinan untuk menghadapi situasi di mana pemisah baris diperlukan dalam kandungan sebaris untuk estetika atau organisasi tujuan. Walaupun CSS menyediakan kaedah untuk memilih elemen tertentu, tugas memaksa pemisah baris selepas item blok sebaris tertentu menjadi satu cabaran.

Dalam kod HTML dan CSS yang disediakan, item senarai pada mulanya dipaparkan secara mendatar dalam satu baris. Walau bagaimanapun, hasil yang diinginkan adalah untuk mengagihkannya kepada tiga lajur. Penyelesaian konvensional seperti menambah pemisah baris menggunakan
teg atau apungan memanfaatkan tidak boleh dilaksanakan.

Penghadan CSS:

CSS tidak mempunyai ciri khusus untuk menyuntik pemisah baris terus dalam elemen sebaris atau blok sebaris. Pengehadan ini berpunca daripada sifat nilai paparan ini, yang sememangnya tidak menyokong pemisah baris.

Pendekatan alternatif:

Penyelesaian yang ditunjukkan melibatkan mencipta elemen pseudo ( :selepas) untuk item senarai ketiga. Elemen pseudo ini diberikan kandungan "A" (mewakili watak baris baharu) dan sifat ruang putih "pra" untuk mengekalkan pemisah baris.

Nota:

Pendekatan yang dibentangkan boleh digunakan apabila menggunakan elemen sebaris. Apabila berurusan dengan elemen blok sebaris, kaedah ini tidak berkesan. Dalam senario sedemikian, penyelesaian alternatif, seperti CSS Grid atau Flexbox, mungkin lebih sesuai.

Atas ialah kandungan terperinci Bagaimana Memaksa Pemisahan Talian Dalam Kandungan Sebaris dalam CSS?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!