Apakah unsur pseudo sumber?

Elemen pseudo sumber ialah jenis elemen pseudo khas dalam CSS. Ia membenarkan pembangun untuk memasukkan kandungan sebelum atau selepas elemen dalam DOM Tidak seperti elemen pseudo biasa, elemen pseudo sebenarnya mencipta elemen baharu gaya elemen sedia ada. Elemen pseudo sumber pertama kali diperkenalkan dalam spesifikasi CSS2 dan diperluaskan dan dipertingkatkan lagi dalam CSS3 Ia digunakan untuk memasukkan kandungan pada kedudukan tertentu elemen dalam DOM tanpa menambah penanda atau elemen tambahan dalam HTML mengawal gaya dan susun atur halaman secara fleksibel.

Sistem pengendalian tutorial ini: sistem Windows 10, komputer DELL G3.

Elemen pseudo ialah jenis elemen pseudo khas dalam CSS yang membenarkan pembangun memasukkan kandungan sebelum atau selepas elemen dalam DOM. Tidak seperti kelas pseudo biasa, elemen pseudo sebenarnya mencipta elemen baharu dan bukannya mengubah gaya elemen sedia ada.

Sumber pseudo-elemen mula-mula diperkenalkan dalam spesifikasi CSS2 dan telah diperluaskan dan ditambah baik dalam CSS3. Ia digunakan untuk memasukkan kandungan di lokasi tertentu elemen dalam DOM tanpa menambah penanda atau elemen tambahan dalam HTML. Ini membolehkan pembangun mengawal gaya dan reka letak halaman mereka dengan lebih fleksibel.

Sintaks untuk unsur pseudo sumber menggunakan tanda bertindih ganda (::) sebagai awalan, diikuti dengan nama unsur pseudo. Berikut ialah beberapa unsur pseudo sumber yang biasa digunakan:

1 ::sebelum: Sisipkan kandungan sebelum kandungan elemen.

2 ::selepas: Masukkan kandungan selepas kandungan elemen.

3 ::huruf pertama: Pilih huruf pertama elemen.

4 ::first-line: Pilih baris pertama elemen.

5 ::selection: Pilih teks yang dipilih oleh pengguna.

Sesetengah kesan dan fungsi yang menarik boleh dicapai menggunakan unsur pseudo sumber. Sebagai contoh, anda boleh menggunakan ::before dan ::after untuk menambah elemen hiasan seperti anak panah, ikon atau imej latar belakang. Anda boleh menggunakan ::huruf pertama dan ::baris pertama untuk menukar gaya teks, seperti saiz fon, warna atau ketinggian baris. ::selection boleh digunakan untuk menukar warna latar belakang atau warna teks teks yang dipilih pengguna.

Penggunaan elemen pseudo sumber adalah serupa dengan pemilih. Anda boleh memilih elemen mengikut nama kelas, ID, nama teg atau pemilih lain dan menggunakan elemen pseudo untuk menentukan gaya. Sebagai contoh, kod CSS berikut akan memasukkan anak panah sebelum elemen dengan kelas "kotak":

.box::before {
  content: "→";
}

Perlu diingatkan bahawa atribut kandungan unsur pseudo sumber diperlukan untuk menentukan kandungan yang hendak disisipkan. Ini boleh berupa teks, imej, pembilang atau elemen visual lain. Jika anda tidak menetapkan atribut kandungan, elemen pseudo tidak akan dipaparkan.

Ringkasnya, elemen pseudo sumber ialah alat berkuasa dalam CSS yang boleh memasukkan kandungan sebelum atau selepas elemen dalam DOM. Mereka dibezakan daripada kelas pseudo biasa dengan menggunakan dua titik bertindih (::) sebagai awalan, dan menyediakan pemilih dan atribut yang kaya untuk menentukan gaya. Menggunakan unsur pseudo sumber, pembangun boleh mencapai reka letak halaman yang lebih fleksibel dan kreatif serta kesan gaya.

Atas ialah kandungan terperinci Apakah unsur pseudo sumber?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!