Jeg forsøger at ændre stilen på en knap med et indlejret billede som vist i følgende Fiddle:
I eksemplet er der desværre ingen billeder, er jeg bange for.
Jeg prøver at:
baggrundsfarven
for knappen, når den er deaktiveretJeg har prøvet at gøre i button[disabled]
. Men nogle effekter kunne ikke deaktiveres. som
top: 1px; position: relative;
og image.
For de deaktiverede knapper kan du bruge pseudo-elementet :disabled
. Det virker for alle elementer.
For browsere/apparater, der kun understøtter CSS2, kan du bruge selektoren [disabled]
.
Som med billedet skal du ikke indsætte et billede i knappen. Brug CSS background-image
med background-position
og background-repeat
. På den måde vil billedet ikke blive trukket.
Valgsproblem: her er et link til det specifikke spørgsmål:
Eksempel på den handicappede selector:
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>