select-Element, beginnend mit Klassennamen und enthält einen Teil der Zeichenfolge

Question

Ich werde select-Element mit Klasse, aber dem Namen ‚path_from‘ usw.

ich Ihnen Beispiel

<div class='path_from_5_to_6'></div> 
<div class='_6'></div> 
<div class='path_from_6_to_5'></div> 
<div class='path_from_3_to_2'></div> 

Ich möchte Lassen Sie zeige Element auswählen welche Klasse beginnt mit path_from aber enthält '_6'

Wie kann ich das tun?

Answer 1

können Sie verwenden [class^="path_from"][class*="_6"] Attributselektor

• [class^="path_from"] - Klasse beginnt mit path_from
• [class*="_6"] - Klasse enthält _6

[class^="path_from"][class*="_6"] { 
 
    background: blue; 
 
}

<div class='path_from_5_to_6'>DIV</div> 
 
<div class='_6'>DIV</div> 
 
<div class='path_from_6_to_5'>DIV</div> 
 
<div class='path_from_3_to_2'>DIV</div>

Answer 2

hier ist ein Beispiel

[class*="path"][class*="6"] { 
 
    width: 100px; 
 
    height: 100px; 
 
    background: yellow; 
 
}

<div class="path_To_6"></div>

Answer 3

Sie dies nicht tun. Das verwenden Sie class und id für. class für verwandte Elemente und id für einzelne Elemente.

<div class="path_6" id="path_from_5_to_6"></div> 
<div id="_6"></div> 
<div class="path_6" id="path_from_6_to_5"></div> 
<div id="path_from_3_to_2"></div> 

Dann wählen Sie mit Ihnen .path_6 nur:

.path_6 { 
    // styles 
}