Pseudo-klasse read-only

De pseudo-klasse read-only bepaalt de stijl van inputs met het readonly attribuut. Zo'n input is alleen-lezen, wat betekent dat het onmogelijk is om gegevens in te voeren of te wijzigen, maar ze kunnen wel worden geselecteerd en gekopieerd.

Syntaxis

cssselector:read-only {
  
}

Voorbeeld

Laten we een lichtgrijze rand instellen voor een input die alleen-lezen is:

html<p>
  <label>Voer tekst in</label>
  <input type="text">
</p>
<p>
  <label>Lees tekst</label>
  <input type="text" value="text" readonly>
</p>

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

Результат:

Zie ook

pseudo-klasse :read-write,
die de stijl bepaalt voor inputs die beschrijfbaar zijn
pseudo-klasse :default,
die de stijl bepaalt voor standaard elementen
pseudo-klasse :indeterminate,
die de stijl bepaalt voor keuzerondjes die zich in een onbepaalde staat bevinden
pseudo-klasse :optional,
die de stijl bepaalt voor een input zonder het required attribuut
pseudo-klasse :placeholder-shown,
die de stijl bepaalt voor elementen wanneer placeholder-tekst wordt weergegeven
pseudo-klasse :required,
die de stijl bepaalt voor een input met het required attribuut
pseudo-klasse :focus-within,
die de stijl bepaalt voor elementen in focus
eigenschap caret-color,
die de kleur van de tekstcursor in een input bepaalt