Πώς αλλάζω τα στυλ των κουμπιών με το χαρακτηριστικό 'disabled';

/* Επιλογέας ιδιότητας 'disabled' */
button[disabled] {
  opacity: 0.6; /* Παράδειγμα: κάντε το κουμπί λιγότερο διαφανές */
  cursor: not-allowed; /* Παράδειγμα: αλλάξτε το δείκτη */
  background-color: #ccc; /* Παράδειγμα: αλλάξτε το χρώμα φόντου */
  color: #666; /* Παράδειγμα: αλλάξτε το χρώμα κειμένου */
}

/* Για την ψευδο-κλάση ':disabled' */
button:disabled {
  /* Εφαρμόζονται τα ίδια στυλ */
  opacity: 0.6;
  cursor: not-allowed;
  background-color: #ccc;
  color: #666;
}

Μπορείτε επίσης να χρησιμοποιήσετε συνδυασμούς επιλογέων, για παράδειγμα:

.my-button[disabled] {
  /* Στυλ για συγκεκριμένο κουμπί */
}

Είναι σημαντικό να θυμάστε τη συγκεκριμενικότητα του CSS. Τα στυλ που εφαρμόζονται μέσω επιλογέα με ιδιότητα ή ψευδο-κλάση :disabled μπορούν να υπερισχύσουν από πιο συγκεκριμένους κανόνες.