Bir HTML kapsayıcısına birden çok sınıf nasıl atanır? [kapalı]


398

Tek bir HTMLkaba birden çok sınıf atamak mümkün mü ?

Gibi bir şey:

<article class="column, wrapper"> 

Şu an ne problemin var? Herhangi bir şekilde bu sorunun çözümü oldu. Başka herhangi bir sorun birkaç faktöre bağlı olabilir.
Aurelio De Rosa

1
Bu yapılabilir olsa da, genellikle CSS mirası olan iç içe geçmiş kaplar kullanıyorum. Çok daha güzel ve genellikle daha kullanışlıdır.
Jonathan Henson

Virgül kaldırıldıktan sonra hala bir sorun yaşıyorsanız, kuralların neden çalışmadığına dair rehberliğe bakmanızı öneririm . Benim için en yaygın hız tümse buldum orada "Stenografi poperty kullanımı" (yani, dolaylı olarak varsayılan bir değere geri döndürme) olarak tanımlanan durum
NJ

Yanıtlar:


531

Bunun için virgül kaldırmanız yeterlidir:

<article class="column wrapper"> 

3
<makale sınıfı = "sınıf1 sınıf2 ... sınıfN">
Andre Elrico

1
Virgül yerine boş alan yarattı. Ama evet cevap için teşekkürler
Soham Mehta

188

Standarttan

7.5.2 Eleman tanımlayıcıları: id ve sınıf özellikleri

Özellik tanımları

id = ad [CS]
Bu özellik bir öğeye bir ad atar. Bu adın bir belgede benzersiz olması gerekir.

class = cdata-list [CS]
Bu özellik, bir öğeye bir sınıf adı veya sınıf adı kümesi atar. Herhangi bir sayıda öğeye aynı sınıf adı veya adı atanabilir. Birden fazla sınıf adının boşluk karakteriyle ayrılması gerekir.

Evet, aralarına boşluk bırak.

<article class="column wrapper">

Tabii ki, CSS mirası ile yapabileceğiniz birçok şey var. İşte daha fazla okumak için bir makale .


3
Aynı öznitelikler için farklı değerler ayarlayan birden çok sınıfa bir öğe atanırsa, tarayıcının nasıl tepki vermesi beklenir. Bunun için bir öncelik sırası var mı?
Sonsuzca

6
@JonathanHenson: hayır, değil. Bağlı özgüllük durumunda, CSS'de daha sonra ortaya çıkan kural kazanır.
Ulrich Schwarz

1
@UlrichSchwarz daha sonra listelenen CSS sınıfını (bunu test ettiğimde ne umuyordum) veya daha sonra tüm CSS dosyalarında mı? Birincisi, test ettiğim tarayıcılarda kesinlikle çalışmadığı için, ikinci hipotezi test ederken.
Jonathan Henson

9
@JonathanHenson: CSS 2.1 spesifikasyonlarına göre , "eğer iki beyan aynı ağırlık, menşe ve özgüllüğe sahipse, ikincisi kazanır. İçe aktarılan stil sayfalarındaki beyanlar stil sayfasındaki herhangi bir beyandan önce kabul edilir." Yani CSS beyan emri. Sınıf özniteliğindeki adların belirli bir sırası yoktur, çünkü ref.foo için sözdizimsel şeker , " öznitelikteki bir kelimedir ". [class ~= foo] fooclass
Ulrich Schwarz

1
@UlrichSchwarz Açıklama için teşekkür ederim.
Jonathan Henson

18

Bir html öğesine birden çok sınıf atamak için , sınıf özniteliğinin alıntılarına her iki sınıf adını da ekleyin ve bunları boşlukla ayırın:

<article class="column wrapper"> 

Yukarıdaki örnekte columnve wrapperiki ayrı css sınıfı vardır ve her iki özelliği de articleöğeye uygulanır .


16
bu cevabın öncekinden farkı nedir?
Iván Rodríguez Torres

-2

sınıfın arasına bir nokta koymanız gerekir.

class = "column.wrapper">

Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.