Ziel mehrere Elemente, von denen jedes besitzen die gleiche Klasse

Question

Deshalb möchte ich im Grunde

tun, um

table.mobile, td.mobile, tr.mobile { 
    some css 
} 

gibt es eine Möglichkeit, dies zu tun, ohne jedes Element der Klasse angeben zu müssen?

So etwas wie

(table, td, tr).mobile { 
    some css 
} 

Answer 1

Noch nicht. CSS-Selektoren der Stufe 4 geben :matches() an, Browser unterstützen dies jedoch noch nicht.

Firefox und Chrome unterstützen derzeit experimentelle Präfix pseudo-Klassen :-moz-any und: -webkit-any so für diese Browser, können Sie

:-moz-any(table, tr, td).mobile { 
 
    display:inline-block; 
 
    border-width: 1px; 
 
    border-style:solid; 
 
    padding:3px 
 
} 
 
:-webkit-any(table, tr, td).mobile { 
 
    display:inline-block; 
 
    border-width: 1px; 
 
    border-style:solid; 
 
    padding:3px 
 
} 
 
table { border-color:blue; } 
 
tr { border-color:green; } 
 
td { border-color:red; } 
 
p { border-color:black; }

<table class="mobile"> 
 
<tr class="mobile"> 
 
    <td class="mobile">borders</td> 
 
</tr> 
 
</table> 
 
<p class="mobile"> 
 
no border 
 
</p>

Answer 2

table,tr,th.mobile{ 
    some css 
} 

Answer 3

können Sie

.mobile 
{ 
// put css that are common to all element with class called mobile 
} 

Answer 4

*.mobile{ 
 
background:#00496d; 
 
color:#fff; 
 
}

<table style="width:100%;"> 
 
<tr height="25" class="mobile"> 
 
<td width="33%">TEXT</td> 
 
<td width="34%">TEXT</td> 
 
<td width="33%">TEXT</td> 
 
</tr> 
 
<tr height="25"> 
 
<td class="mobile">TEXT</td> 
 
<td>TEXT</td> 
 
<td>TEXT</td> 
 
</tr> 
 
<tr height="25"> 
 
<td>TEXT</td> 
 
<td class="mobile">TEXT</td> 
 
<td>TEXT</td> 
 
</tr> 
 
</table> 
 
<div class="mobile" style="width:100px; height:100px;"></div>

Es

Versuchen verwenden Sobald * .your Klassenname oder .className möglich ist, um zu arbeiten für Ihre Anforderung.