A sınıfı ve B sınıfı olan bir element için CSS stili

oy
23

Her iki sınıf a ve sınıf b sahip bir öğe stil gerekiyor. Nasıl yaparım?

sınıfları html görünür sırası değişebilir.

<style>
div.a ? div.b{
color:#f00;
}
</style>
<div class=a>text not red</div>
<div class=b>text not red</div>
<div class=a b>red text</div>
<div class=b a>red text</div>
Oluştur 30/04/2009 saat 14:11
kaynak kullanıcı
Diğer dillerde...                            


5 cevaplar

oy
-2

Evet, ortak bir sınıfını kullanın, ya da neden JavaScript içerik değişiklikleri eğer dinamik

Cevap 30/04/2009 saat 14:15
kaynak kullanıcı

oy
51

Bu tamamen mümkün. Eğer (herhangi bir boşluksuz) Bir elemanın iki sınıfları belirtirseniz, bu onu her ikisinin kural uygulamak için sahip gerektiği anlamına gelir.

div.a {
  color: blue;
}
div.b {
  color: green;
}
div.a.b {
  color: red;
}
<div class="a">
  A
</div>
<div class="b">
  B
</div>
<div class="a b">
  AB
</div>

Cevap 30/04/2009 saat 14:18
kaynak kullanıcı

oy
11

Sınıf seçicileri birleştirilebilir:

div.a.b {
  color: red;
}

Alıntı spec :

"Sınıf" değerlerin bir eşleşme sağlamak için her değer bir gelmelidir "".

Örneğin, aşağıdaki kural "sınıfı" özellik "kırsal" ve "deniz" terimi boşlukla ayrılmış değerler listesi tahsis edilmiş olan herhangi bir P elemanı ile eşleşir:

p.marine.pastoral { color: green }

Bu kural eşleştiğinde class="pastoral blue aqua marine"ama için eşleşmiyor class="pastoral blue".

Cevap 30/04/2009 saat 14:20
kaynak kullanıcı

oy
4
div[class~="a"][class~="b"]{
color:#f00;
}
Cevap 30/04/2009 saat 14:24
kaynak kullanıcı

oy
0

/ * Sınıf a sahip div etiketi seçmek ve birlikte b * /

 <style>
    div.a.b
    { 
         color:#f00;
    }
    </style>
    <div class="a">text not red</div>
    <div class="b">text not red</div>
    <div class="a b">red text</div>
    <div class="b a">red text</div>
Cevap 20/02/2015 saat 07:05
kaynak kullanıcı

Cookies help us deliver our services. By using our services, you agree to our use of cookies. Learn more