Görünürlük gizliliğini kaybettikten sonra onay kutusunu değiştiremiyorum

CSS ile onay kutusunu işaretleyin onay kutusunu işaretleyin. Doğru olması için bir resmim var, onay kutumdan alıntı yapmak istiyorum. Ama ben visibility: hidden veya display_none kullandıktan sonra değiştirecek hiçbir şey koyamıyorum. Bana yardım eder misin? Görünürlük gizliliğini kaybettikten sonra onay kutusunu değiştiremiyorum

benim HTML:

<div class="contact_dane"> 

      <input type="checkbox" id="contact_data" checked> 
      <label for="contact_data"> 
      <span> 
       Lorem ipsum lorem ipsum lorem ipsum 
      </span> 
      </label> 

      </div>

Ve bu benim CSS:

.contact_dane input[type="checkbox"] { 
    visibility: hidden; 
} 

.contact_data input[type="checkbox"] + label span { 
    display: inline-block; 
    width: 50px; 
    height: 50px; 
    background: url("ok.jpg") left top no-repeat; 
}

// edit: pardon, Sorumu basitleştirmek için çalışıyordu, ben css değiştirmek için unuttum sınıf isimleri, şimdi tamam. öznitelik

<input type="checkbox" id="contact_data" checked>

kontrol

kaynak

2016-03-31 ChickenLeg

deneyin kullanımı javacript. –

kullanım ekranı: Yok ve ne demek yerine geçemezsiniz? Ayrıca css isimleriniz html'deki sınıf isimleri ile aynı değildir. – Jester

Düzenleme sırasında yazdığım gibi css isimleri için teşekkürler, soru basitleştirmek ve css isimlerini değiştirmeyi unuttum. "Değiştirilemez" ile, gördüğüm tüm öğreticilerde, tam olarak böyle oldu ve css, ayarladığım arka planla değiştirildi. Benim durumumda, onay kutusu kaybolur ve bunun yerine hiçbir şey gösterilmez. – ChickenLeg

bkz olması gerektiği:

<input type="checkbox" id="contact_data" checked="expression">

kaynak

2016-03-31 12:13:27

Kullanım display: none; sen onay kutusunu üzerinde. Ayrıca ben böyle label yılında span ile input sarın tavsiye:

<div class="contact_dane"> 
    <label for="contact_data"> 
    <input type="checkbox" id="contact_data" checked> 
     <span> 
     Lorem ipsum lorem ipsum lorem ipsum 
     </span> 
    </label> 
</div>

Ve CSS:

.contact_dane input[type="checkbox"] { 
    display: none; 
} 

.contact_dane label span:before { 
    content: ""; 
    display: inline-block; 
    margin-right: 10px; 
    width: 50px; 
    height: 50px; 
    background: url("ok.jpg") left top no-repeat; 
}

JSFiddle here

kaynak

2016-03-31 12:19:47 oboshto

Nedenini bilmiyorum ama hala çalışmıyor/ – ChickenLeg

ve neyin var? – oboshto

Yine de orijinal değil, boş bir yer bile değil, onaylanmış bir onay kutusu. Gösterildikten sonra olduğu gibi: Yok, yok olur ve bunun yerine hiçbir şey olmaz. – ChickenLeg

Sen yapamaz bir arka plan resmiyle. Sadece css ile stil kimse bu örnekleri deneyin:

kaynak

2016-03-31 12:43:42

Görünürlük gizliliğini kaybettikten sonra onay kutusunu değiştiremiyorum

cevap

İlgili konular