Wybierz etykietę według typu wejściowego

Question

Czy istnieje sposób wykluczenia lub wyboru etykiety według typów danych wejściowych, podobnie jak w polu wprowadzania?

label:not([type=checkbox]) 
label[type=checkbox] 

Answer 1

Jeśli dajesz wyboru określonego identyfikatora, że wszyscy zaczynają z tego samego, można wykonać następujące czynności:

HTML

<input type="checkbox" id="chkTerms" /> 
<label for="chkTerms">Read terms & conditions</label> 

CSS

label[for*="chk"], label[htmlfor*="chk"] 
{ 
css here 
} 

Tylko prawdopodobnie nowoczesne przeglądarki. EDYCJA: Właśnie próbowałem skrzypce: link i działa w chrome i IE 8 & 9, ale nie 7. Nie próbowałem go w FF.

EDIT2: Aby wyjaśnić, co się tu dzieje, nawiasy kwadratowe szukają wymaganego atrybutu. Gwiazdka zmienia zachowanie równości z zwykłego równika, na znacznik zawiera - wszędzie tam, gdzie atrybut for zawiera "chk", zastosuje ten styl. Możesz zastąpić * znakiem ^, a zmieni to na początek z zamiast zawiera.

EDIT3: BoltClock dostarczył poprawkę do IE7 w komentarzu, zaktualizowałem odpowiedź, aby ją uwzględnić.

Answer 2

Co powiecie na ? Może działać, jeśli tekst znajduje się tuż za elementem wejściowym. Nie testowałem tego.

Answer 3

można korzystać z wyboru podstawowego odniesienia danych atrybutu ..

<input type="checkbox" name="checkbox-1" id="checkbox-0" class="custom" /> 
<label for="checkbox-0">Whatever</label> 

Jeśli nie można oczekiwać tego ... daj nam znać ...