Bagaimanakah Saya Boleh Menyembunyikan Teks Tidak Ditanda dalam HTML Menggunakan CSS Sahaja?

Menyembunyikan Teks Tanpa Tag HTML dalam HTML

Masalah:

Anda mempunyai kod HTML yang mengandungi teks yang tidak mempunyai sebarang teg HTML di sekelilingnya. Khususnya, anda ingin menyembunyikan teks "Enter" yang terletak sejurus selepas teg "p". Walau bagaimanapun, tidak mungkin untuk membungkus teks dengan elemen HTML.

Penyelesaian: Helah Saiz Fon CSS

Untuk mencapai matlamat anda, anda boleh menggunakan penggodaman CSS memanfaatkan sifat saiz fon:

1. Buat kelas, mis. ".entry", dan tetapkan saiz fon 0:

.entry {
  font-size: 0;
}

2. Dalam kelas ini, tambahkan pemilih kad bebas ("*") untuk menetapkan saiz fon kembali kepada saiznya nilai awal:

.entry * {
  font-size: initial;
}

Secara lalai, semua elemen mewarisi saiz fon ibu bapa mereka. Walau bagaimanapun, dengan menetapkan saiz fon kelas ".entry" kepada 0, anda menyembunyikan semua elemen anaknya dengan berkesan. Pemilih kad bebas kemudian mengatasi tetapan ini untuk sebarang elemen bersarang, membenarkan teksnya dipaparkan.

Contoh:

Dalam kod anda, gunakan kelas ".entry" ke div induk dan pastikan teks "Enter" berada dalam kelas ini:

<div><p>Dengan helah CSS ini, teks "Enter" akan disembunyikan manakala selebihnya kandungan dalam kelas ".entry" kekal kelihatan.</p></div>

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Menyembunyikan Teks Tidak Ditanda dalam HTML Menggunakan CSS Sahaja?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!