Apakah maksud ::before dalam css

"::before" dalam css bermaksud "sebelum..." Ia adalah elemen kelas pseudo yang digunakan untuk mencipta elemen pseudo dan menetapkannya sebagai elemen anak pertama bagi elemen yang dipilih sebelum kandungan elemen lain, sintaksnya ialah "elemen::before{style code}".

Persekitaran pengendalian tutorial ini: sistem Windows 10, versi CSS3&&HTML5, komputer Dell G3.

Apakah maksud ::before dalam css

Dalam css, ::before ialah elemen kelas pseudo yang mewakili elemen kandungan yang dijana , mewakili elemen anak pertama bagi gaya abstrak elemen yang sepadan, iaitu: elemen anak pertama bagi elemen yang dipilih.

Gunakan ::sebelum untuk memasukkan kandungan yang hendak dimasukkan sebelum kandungan elemen lain, dan ia akan dipaparkan sebaris secara lalai. ::before memerlukan atribut kandungan untuk menentukan nilai kandungan.

::sebelum senario penggunaan (seperti menambah ikon di hadapan elemen)

<p class="test">
     2019/11/29 15:35:51
</p>//在这前面加一个小闹钟的图标就可使用::befor

.test::before
  {
   content: url(./1597910280\(1\).png);
 }

Mata yang sama:

1. Objek kelas pseudo, digunakan untuk menetapkan kandungan sebelum objek

2 ::before dan :before kaedah penulisan adalah bersamaan

Perbezaan:

: sebelum ditulis dalam Css2, ::before ditulis dalam Css3

:before mempunyai keserasian yang lebih baik daripada ::before, tetapi disyorkan untuk menggunakan ::before dalam pembangunan H5

Nota:

1. Elemen kelas pseudo harus digunakan bersama atribut kandungan

2 lapisan dan tidak boleh digunakan melalui js Untuk beroperasi

3. Kesan khas objek kelas pseudo biasanya diaktifkan melalui: hover gaya kelas pseudo

Saya rasa ini agak sia-sia, anda boleh menggunakannya atau tidak.

Perbezaan antara unsur pseudo dan kelas pseudo

• Kelas Pseudo

Kelas Pseudo ialah digunakan untuk memilih antara maklumat pokok DOM di luar skop, atau maklumat yang tidak boleh diwakili oleh pemilih mudah. Yang pertama termasuk unsur-unsur yang sepadan dengan keadaan yang ditentukan, seperti :visited, :active termasuk unsur-unsur dalam pepohon DOM yang memenuhi syarat logik tertentu, seperti :first-child, :first-of-type, :target; . Kelas pseudo CSS digunakan untuk menambah kesan khas kepada pemilih tertentu.

• Pseudo-elements

Pseudo-elements ialah elemen maya yang tidak ditakrifkan dalam pepohon DOM. Tidak seperti pemilih lain, ia tidak mengambil elemen sebagai unit pemilihan terkecil, ia memilih kandungan elemen yang ditentukan. Contohnya::before bermaksud kandungan sebelumnya bagi elemen
yang dipilih, iaitu, "" ::selection bermaksud kandungan yang dipilih bagi elemen yang dipilih. Elemen pseudo CSS digunakan untuk menetapkan kesan khas kepada pemilih tertentu.                                                                                                                                                                                                                                                                                    Walau bagaimanapun, atas sebab sejarah, penyemak imbas terus menyokong elemen pseudo bermula dengan

, tetapi disyorkan supaya ia ditulis dalam format standard yang bermula dengan

.

3) Senarai pseudo-class/pseudo-elements:::::

Kelas pseudo mempunyai keutamaan yang sama seperti kelas dan elemen pseudo mempunyai keutamaan yang sama seperti teg. Secara amnya, cara menilai keutamaan adalah !penting > pemilih ID kelas > Terdapat juga kaedah pengiraan mudah Berat helaian gaya sebaris ialah 1000, berat pemilih ID ialah 100, berat pemilih Kelas ialah 10, berat pemilih teg HTML ialah 1, dan beratnya ialah 1. sebenarnya Ia tidak dikira dalam perpuluhan Perwakilan berangka hanya untuk menggambarkan idea Kita boleh menambah peraturan dalam pemilih dan membandingkan pemberat, lebih tinggi keutamaan gaya akan digantikan oleh yang kemudiannya.

(Mempelajari perkongsian video: tutorial video css)

Atas ialah kandungan terperinci Apakah maksud ::before dalam css. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!