Bolehkah :first-of-type Pilih Elemen Pertama dengan Nama Kelas Tertentu?

Menggunakan :first-of-type Selector with Class Name

Soalan:

Boleh pemilih CSS3 :first-of-type digunakan untuk memilih elemen pertama dengan kelas tertentu nama?

Jawapan:

Tidak, tidak boleh menggunakan :first-of-type sahaja untuk memilih elemen pertama dengan kelas tertentu.

Penjelasan:

Kelas pseudo :first-of-type menyasarkan yang pertama unsur jenisnya di kalangan adik-beradiknya. Menambah pemilih kelas atau pemilih jenis pada kelas pseudo ini menunjukkan bahawa pemilihan harus dihadkan kepada elemen dalam jenis tertentu (cth., div atau p) yang juga mempunyai nama kelas yang diberikan. Walau bagaimanapun, CSS tidak menyediakan pemilih khusus :first-of-class yang hanya memilih kejadian pertama kelas.

Penyelesaian:

Sebagai penyelesaian, anda boleh mencapai fungsi ini dengan menggunakan gabungan nama kelas dan kekhususan pemilih:

1. Tetapkan nama kelas (cth., .myclass1) pada elemen pertama yang anda mahu gunakan gaya unik.
2. Gunakan pemilih berikutnya dengan nama kelas yang sama dan pemilih adik beradik (~) untuk menetapkan semula mana-mana gaya yang digunakan selepas elemen pertama .

Contoh:

.myclass1 { color: red; }
.myclass1 ~ .myclass1 { color: /* default, or inherited */; }

Ini memastikan bahawa hanya elemen pertama dengan kelas .myclass1 menerima gaya yang ditentukan, manakala elemen berikutnya mewarisi gaya lalai atau induk.

Nota Tambahan:

• Teknik CSS lain, seperti nth- pemilih child() atau :last-of-type(), boleh digunakan untuk pemilihan yang lebih kompleks keperluan.
• Penggunaan JavaScript atau prapemproses mungkin memberikan fleksibiliti tambahan untuk memilih elemen tertentu berdasarkan nama kelasnya.

Atas ialah kandungan terperinci Bolehkah :first-of-type Pilih Elemen Pertama dengan Nama Kelas Tertentu?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!