Целевых несколько элементов, каждый из которых обладают таким же классом

Question

Так что я хочу сделать в основном

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

есть способ сделать это без того, чтобы указать класс каждого элемента?

Так что-то вроде

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

Answer 1

Пока нет. CSS-селектор уровня 4 указывает :matches(), но браузеры еще не поддерживают его.

Firefox и Chrome в настоящее время поддерживают экспериментальные префиксами псевдоклассы :-moz-any и: -webkit-any так и для тех браузеров, вы можете написать

:-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

вы можете использовать

.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>

разок попробовать * .your Classname Или .Classname можно работать для вашего требования.