Ο ψευδο-κλάσος read-only

Ο ψευδο-κλάσος read-only ορίζει το στυλ για inputs με το χαρακτηριστικό readonly. Ένα τέτοιο input προορίζεται μόνο για ανάγνωση, δηλαδή, είναι αδύνατο να εισαχθούν ή να αλλαχθούν δεδομένα σε αυτό, ωστόσο μπορούν να επιλεγούν και να αντιγραφούν.

Σύνταξη

cssεπιλογέας:read-only {
  
}

Παράδειγμα

Ας ορίσουμε χνούδινες γκριζωπές kαθόδους σε ένα input που προορίζεται μόνο για ανάγνωση:

html<p>
  <label>Εισαγωγή κειμένου</label>
  <input type="text">
</p>
<p>
  <label>Ανάγνωση κειμένου</label>
  <input type="text" value="κείμενο" readonly>
</p>

cssinput:read-only {
  border: 1px solid #D8DFE8;
}

Результат:

Δείτε επίσης

ο ψευδο-κλάσος :read-write,
που ορίζει στυλ για inputs που είναι προσβάσιμα για τροποποίηση
ο ψευδο-κλάσος :default,
που ορίζει στυλ για τα στοιχεία που είναι προεπιλεγμένα
ο ψευδο-κλάσος :indeterminate,
που ορίζει στυλ για διακόπτες που βρίσκονται σε απροσδιόριστη κατάσταση
ο ψευδο-κλάσος :optional,
που ορίζει στυλ για input που δεν έχει το χαρακτηριστικό required
ο ψευδο-κλάσος :placeholder-shown,
που ορίζει στυλ για στοιχεία όταν εμφανίζεται το κείμενο-υπόδειξη
ο ψευδο-κλάσος :required,
που ορίζει στυλ για input που έχει ορισμένο το χαρακτηριστικό required
ο ψευδο-κλάσος :focus-within,
που ορίζει στυλ για στοιχεία που βρίσκονται στο επίκεντρο
η ιδιότητα caret-color,
που ορίζει το χρώμα του κέρσορα κειμένου σε ένα input