Rumah >hujung hadapan web >tutorial css >Bolehkah Anda Memaksa Pemutusan Baris Selepas Elemen `` Sebaris dengan CSS Sahaja?

Bolehkah Anda Memaksa Pemutusan Baris Selepas Elemen `` Sebaris dengan CSS Sahaja?

Susan Sarandon
Susan Sarandonasal
2024-10-30 00:57:291044semak imbas

Can You Force a Line Break After an Inline `` Element with CSS Only?

Mencipta Pemisah Baris dengan CSS

Bolehkah anda mencapai pemisah baris menggunakan CSS sahaja, tanpa menambah teg HTML? Matlamatnya adalah untuk memasukkan pemisah baris selepas

elemen tanpa menjejaskan status sebarisnya.

Penyelesaian:

Untuk mencapai ini, ikut langkah berikut:

  1. Gunakan paparan: sebaris; ke

    elemen untuk mengekalkannya pada baris yang sama.

  2. Buat pseudoselector untuk

    :selepas dan tambah gaya berikut:

    • kandungan: "a"; untuk memasukkan ruang tidak pecah yang tidak kelihatan di hujung

      elemen.

    • ruang putih: pra; untuk mengekalkan sebarang ruang putih utama dalam teks yang mengikuti

    .

Contoh:

<code class="css">h4 {
    display:inline;
}
h4:after {
    content:"\a";
    white-space: pre;
}</code>

Oleh menambahkan CSS ini, pemisah baris akan muncul selepas

elemen, mengekalkan tingkah laku paparan sebarisnya.

Untuk penjelasan lanjut, rujuk: https://stackoverflow.com/a/66000/509752

Atas ialah kandungan terperinci Bolehkah Anda Memaksa Pemutusan Baris Selepas Elemen `` Sebaris dengan CSS Sahaja?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn