Sobes.tech
Junior

Kuidas muuta nuppude stiile, millel on 'disabled' atribuut?

sobes.tech AI

Vastus AI-lt

/* 'disabled' atribiidi valija */
button[disabled] {
  opacity: 0.6; /* Näide: muuda nupu vähem läbipaistvaks */
  cursor: not-allowed; /* Näide: muuda kursorit */
  background-color: #ccc; /* Näide: muuda tausta värvi */
  color: #666; /* Näide: muuda teksti värvi */
}

/* Pseudo-klassi ':disabled' jaoks */
button:disabled {
  /* Sama stiilid kehtivad */
  opacity: 0.6;
  cursor: not-allowed;
  background-color: #ccc;
  color: #666;
}

Samuti saab kasutada valikute kombinatsioone, näiteks:

.my-button[disabled] {
  /* Spetsiifilise nupu stiilid */
}

Oluline on meeles pidada CSS-i spetsiifilisust. Stiilid, mis rakendatakse atribuudi või pseudo-klassi :disabled kaudu, võivad olla üle kirjutatud spetsiifilisemate reeglite poolt.