Aşağıdaki Fiddle'da görüldüğü gibi gömülü bir resme sahip bir düğmenin stilini değiştirmeye çalışıyorum:
Maalesef örnekte hiç resim yok.
Deniyorum:
arka plan rengini
değiştirinButon[devre dışı]içinde yapmayı denedim. Ancak bazı efektler devre dışı bırakılamadı. gibi Üst: 1px; position: relative;
ve image.
Devre dışı bırakılmış düğmeler için :disabled
sözde öğesini kullanabilirsiniz. Tüm elemanlar için çalışır.
Yalnızca CSS2'yi destekleyen tarayıcılar/cihazlar için [disabled]
seçicisini kullanabilirsiniz.
Görselde olduğu gibi, düğmenin içine bir görsel koymayın. CSS background-image
ile background-position
ve background-repeat
kullanın. Bu şekilde, görüntü sürüklenmesi meydana gelmeyecektir.
Seçim sorunu: işte özel soruya bir bağlantı:
Devre dışı bırakılmış seçici için örnek:
button {
border: 1px solid #0066cc;
background-color: #0099cc;
color: #ffffff;
padding: 5px 10px;
}
button:hover {
border: 1px solid #0099cc;
background-color: #00aacc;
color: #ffffff;
padding: 5px 10px;
}
button:disabled,
button[disabled]{
border: 1px solid #999999;
background-color: #cccccc;
color: #666666;
}
div {
padding: 5px 10px;
}
<div>
<button> This is a working button </button>
</div>
<div>
<button disabled> This is a disabled button </button>
</div>