Bolehkah saya Menggunakan Pemilih :first-of-type untuk Memilih Elemen Pertama dengan Kelas Tertentu?

:Pemilih jenis pertama dan Pemilihan Kelas

Pemilih :first-of-type dalam CSS3 direka untuk memilih yang pertama unsur jenis tertentu (cth., p, div, dsb.) dalam kalangan adik-beradiknya. Walau bagaimanapun, salah tanggapan biasa timbul apabila cuba menggunakannya bersama dengan nama kelas.

Soalan:

Adakah mungkin untuk menggunakan :first-of-type pemilih untuk memilih elemen pertama dengan kelas tertentu nama?

Jawapan:

Malangnya, tidak mungkin untuk mencapai ini menggunakan pemilih tunggal. Kelas pseudo :first-of-type beroperasi pada jenis elemen, bukan nama kelas. Menggunakan pemilih kelas dengannya bermakna memilih elemen yang mempunyai kelas yang ditentukan dan juga merupakan jenis yang pertama dalam kumpulan adik-beradik mereka.

Penyelesaian:

Seperti yang ada no :pemilih kelas pertama yang disediakan oleh CSS, penyelesaian boleh digunakan untuk menyasarkan kejadian pertama sesuatu kelas:

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

Di sini, pengisytiharan kelas pertama menetapkan warna semua elemen dengan kelas "myclass1" kepada merah. Pengisytiharan seterusnya menyasarkan mana-mana elemen dengan kelas "myclass1" yang segera didahului oleh elemen lain dengan kelas yang sama. Pengisytiharan terakhir ini menetapkan semula warna kepada nilai lalai atau nilai yang diwarisi untuk semua kecuali kejadian pertama kelas.

Penjelasan dan ilustrasi terperinci penyelesaian ini boleh didapati dalam perkara berikut artikel:

• https://css-tricks.com/the-problem-with-first-child-selector/
• https://www.quirksmode.org/css /contents.html#first-of-type-sibling

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