Bolehkah Inline CSS Style Pseudo-elements Seperti :sebelum dan :selepas?

Menggunakan CSS :sebelum dan :selepas dengan CSS Sebaris

Soalan:

Semasa bekerja dengan tandatangan e-mel HTML yang menggunakan CSS sebaris, adalah perlu untuk menentukan sama ada menggunakan :before dan :after pseudo-elements adalah berdaya maju pilihan. Bagaimanakah kita boleh mencapai sesuatu yang serupa dengan contoh berikut menggunakan CSS sebaris?

Contoh:

td { 
    text-align: justify;
}
td::after { 
    content: "";
    display: inline-block;
    width: 100%;
}

Jawapan:

Menggunakan CSS sebaris untuk menggayakan elemen pseudo tidak mungkin kerana ciri-ciri yang wujud. Pseudo-elements dan pseudo-class mewakili konsep abstrak dalam CSS yang memanjangkan fungsi HTML. Gaya sebaris, walau bagaimanapun, ditakrifkan dalam HTML dan hanya mempengaruhi elemen yang dilampirkan padanya. Oleh itu, gaya sebaris tidak boleh digunakan pada unsur pseudo kerana ia bukan sebahagian daripada struktur HTML.

Adalah penting untuk ambil perhatian bahawa pewarisan digunakan apabila menggunakan unsur pseudo. Sifat yang diwarisi secara lalai akan boleh diakses kepada :before dan :after daripada elemen penjanaan. Sebaliknya, gaya kelas pseudo kekal tidak terjejas. Sebagai contoh, jika anda mentakrifkan penjajaran teks: justify menggunakan atribut gaya sebaris untuk elemen data jadual (td), ia akan diwarisi oleh td:after. Walau bagaimanapun, pengisytiharan td:after dengan atribut gaya sebaris tidak boleh dilakukan dan mesti dilakukan dalam helaian gaya CSS.

Atas ialah kandungan terperinci Bolehkah Inline CSS Style Pseudo-elements Seperti :sebelum dan :selepas?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!