Bagaimana cara menetapkan beberapa kelas ke wadah HTML? [Tutup]


398

Apakah mungkin untuk menetapkan beberapa kelas ke satu HTMLwadah?

Sesuatu seperti:

<article class="column, wrapper"> 

Masalah apa yang Anda miliki sekarang? Bagaimanapun juga itu solusi untuk masalah ini. Masalah lain mungkin tergantung pada beberapa faktor.
Aurelio De Rosa

1
Meskipun ini bisa dilakukan, saya biasanya menggunakan wadah bersarang dengan warisan CSS. Ini jauh lebih cantik, dan biasanya lebih bermanfaat.
Jonathan Henson

Jika Anda masih mengalami masalah setelah penghapusan koma, saya sarankan melihat pedoman tentang mengapa aturan tidak bekerja . Saya telah menemukan speed-benjolan paling umum bagi saya adalah situasi yang digambarkan di sana sebagai "Penggunaan poperty steno" (yaitu, secara implisit mengembalikan ke nilai default)
LJ di NJ

Jawaban:



188

Dari standar

7.5.2 Identifier elemen: atribut id dan kelas

Definisi atribut

id = nama [CS]
Atribut ini memberikan nama ke elemen. Nama ini harus unik dalam dokumen.

class = cdata-list [CS]
Atribut ini memberikan nama kelas atau sekumpulan nama kelas ke suatu elemen. Sejumlah elemen dapat diberi nama atau nama kelas yang sama. Beberapa nama kelas harus dipisahkan oleh karakter spasi.

Ya, cukup beri jarak di antara mereka.

<article class="column wrapper">

Tentu saja, ada banyak hal yang dapat Anda lakukan dengan pewarisan CSS. Berikut adalah artikel untuk dibaca lebih lanjut .


3
Bagaimana seharusnya sebuah browser bereaksi jika suatu elemen ditugaskan ke beberapa kelas yang menetapkan nilai berbeda untuk atribut yang sama. Apakah ada urutan prioritas untuk itu?
EternallyCurious

6
@ JonathanHenson: tidak, tidak. Dalam kasus spesifisitas terikat, aturan yang terjadi kemudian di CSS menang.
Ulrich Schwarz

1
@UlrichSchwarz kelas CSS yang kemudian terdaftar (apa yang saya harapkan ketika saya menguji ini), atau nanti di semua file CSS? Karena yang pertama pasti tidak berfungsi di browser yang saya uji, sementara saya telah menguji hipotesis yang terakhir.
Jonathan Henson

9
@JonathanHenson: Menurut spesifikasi CSS 2.1 , "jika dua deklarasi memiliki bobot, asal dan spesifisitas yang sama, maka yang disebutkan terakhir akan menang. Deklarasi dalam style sheet yang diimpor dianggap sebelum deklarasi apa pun dalam style sheet itu sendiri." Jadi itu adalah perintah deklarasi CSS. Nama-nama dalam atribut kelas tidak memiliki urutan tertentu, karena .foogula sintaksis untuk [class ~= foo] ref , " fooadalah kata dalam classatribut".
Ulrich Schwarz

1
@UlrichSchwarz Terima kasih atas klarifikasi.
Jonathan Henson

18

Untuk menetapkan beberapa kelas ke elemen html , sertakan kedua nama kelas dalam kutipan atribut kelas dan minta dipisahkan oleh spasi:

<article class="column wrapper"> 

Dalam contoh di atas, columndan wrapperdua kelas css terpisah, dan kedua propertinya akan diterapkan ke articleelemen.


16
apa perbedaan jawaban ini dari yang sebelumnya?
Iván Rodríguez Torres

-2

Anda harus meletakkan titik di antara kelas seperti

class = "column.wrapper">

Dengan menggunakan situs kami, Anda mengakui telah membaca dan memahami Kebijakan Cookie dan Kebijakan Privasi kami.
Licensed under cc by-sa 3.0 with attribution required.