Jak przypisać wiele klas do kontenera HTML? [Zamknięte]

398

Czy można przypisać wiele klas do jednego HTMLkontenera?

Coś jak:

<article class="column, wrapper"> 
ARGO
źródło
Jaki masz teraz problem? Jakikolwiek sposób, który był rozwiązaniem tego problemu. Każdy inny problem może zależeć od kilku czynników.
Aurelio De Rosa
1
Chociaż jest to wykonalne, zwykle używam zagnieżdżonych kontenerów z dziedziczeniem CSS. Jest o wiele ładniejszy i zwykle bardziej użyteczny.
Jonathan Henson
Jeśli po usunięciu przecinka nadal masz problem, sugeruję zapoznanie się ze wskazówkami, dlaczego reguły nie działają . Znalazłem najczęstszą dla mnie prowokację prędkości, opisaną tam sytuację jako „Wykorzystanie stenografii” (tj. Domyślnie przywrócenie wartości domyślnej)
LJ w NJ

Odpowiedzi:

531

Po prostu usuń przecinek w następujący sposób:

<article class="column wrapper"> 
Aurelio De Rosa
źródło
3
<article class = "class1 class2 ... classN">
Andre Elrico
1
Wierd swoją przestrzeń zamiast przecinków. Ale tak, dziękuję za odpowiedź
Soham Mehta
188

Od standardu

7.5.2 Identyfikatory elementów: atrybuty id i klasa

Definicje atrybutów

id = nazwa [CS]
Ten atrybut przypisuje nazwę do elementu. Ta nazwa musi być unikalna w dokumencie.

class = cdata-list [CS]
Ten atrybut przypisuje nazwę klasy lub zestaw nazw klas do elementu. Dowolnej liczbie elementów można przypisać tę samą nazwę lub nazwy klas. Wiele nazw klas musi być oddzielonych spacjami.

Tak, po prostu wstaw odstęp między nimi.

<article class="column wrapper">

Oczywiście istnieje wiele rzeczy, które możesz zrobić dzięki dziedziczeniu CSS. Oto artykuł do dalszego czytania .

Jonathan Henson
źródło
3
Jak powinna reagować przeglądarka, jeśli element zostanie przypisany do wielu klas, które ustawiają różne wartości dla tych samych atrybutów. Czy istnieje w tym jakiś priorytet?
EternallyCurious
6
@JathanathanHenson: nie, nie jest. W przypadku powiązanej specyficzności wygrywa reguła, która pojawi się później w CSS.
Ulrich Schwarz
1
@UlrichSchwarz później wymieniona klasa CSS (na co liczyłem, kiedy ją testowałem), czy później we wszystkich plikach CSS? Ponieważ ten pierwszy z pewnością nie działa w przeglądarkach, w których testowałem, podczas gdy testowałem drugą hipotezę.
Jonathan Henson
9
@JathanathanHenson: Zgodnie ze specyfikacją CSS 2.1 „jeśli dwie deklaracje mają tę samą wagę, pochodzenie i specyfikę, ta ostatnia określona wygrywa. Deklaracje w importowanych arkuszach stylów są uważane za poprzedzające jakiekolwiek deklaracje w samym arkuszu stylów”. To jest kolejność deklaracji CSS. Nazwy w atrybucie klasy nie mają określonej kolejności, ponieważ .foojest składniowym cukrem dla [class ~= foo] referencji , „ footo słowo w classatrybucie”.
Ulrich Schwarz
1
@UlrichSchwarz Dziękujemy za wyjaśnienie.
Jonathan Henson
18

Aby przypisać wiele klas do elementu HTML , umieść obie nazwy klas w cudzysłowach atrybutu class i rozdziel je spacją:

<article class="column wrapper"> 

W powyższym przykładzie, columna wrapperdwa oddzielne CSS, i zarówno ich właściwości będą stosowane do articleelementu.

Webeng
źródło
16
czym różni się ta odpowiedź od poprzedniej?
Iván Rodríguez Torres
-2

musisz umieścić kropkę między klasami jak

class = "column.wrapper">

amit kumar
źródło