CSS 参考手册

CSS @规则(RULES)

CSS 属性大全

CSS-Funktionen (Functions)CSS-Selektordatenbank

CSS :read-nur-Selektor

:read-nur CSS-Phantomklasse zur Darstellung des Status, dass ein Element vom Benutzer nicht editiert werden kann (z.B. gesperrte Texteingabefelder).

Vollständiges Referenzhandbuch für CSS-Selektoren

Online-Beispiel

Der Input-Element mit der "readonly"-Eigenschaft wurde mit einem grün-blauen Hintergrund versehen:

Beispiel

<!DOCTYPE　html>
<html>
<head>
<meta　charset="utf-8">　
<title>Grund教程(oldtoolbag.com)</title>　
<style>
input　{　min-width:　25em;　}
input:-moz-read-only　{　background:　cyan;　}
input:read-only　{　background:　cyan;　}
p:-moz-read-only　{　background:　lightgray;　}
p:read-only　{　background:　lightgray;　}
p[contenteditable="true"]　{　color:　blue;　}
</style>
</head>
<body>
<input　type="text"　value="Geben Sie hier alles ein, was Sie möchten.">
<input　type="text"　value="Nur lesbar."　readonly>
<p>Normaler Abschnitt.</p>
<p　contenteditable="true">Editierbarer Abschnitt!</p>
</body>
</html>

Testen Sie es heraus ‹/›

Definition und Verwendung

:read-Der 'only' Selektor wird verwendet, um Elemente auszuwählen, die die Eigenschaft 'readonly' haben.

Formularelemente können die Eigenschaft 'readonly' setzen, um zu definieren, dass das Element nur lesbar ist.

Hinweis: Derzeit unterstützen die meisten Browser,-Der 'only' Selektor ist für <input> und <textarea>-Elemente geeignet, aber er kann auch für Elemente mit der 'readonly'-Eigenschaft verwendet werden.

Browser-Kompatibilität

Die Zahlen in der Tabelle geben die erste Browser-Version an, die diese Eigenschaft unterstützt.

Selektor
:read-only	Unterstützt	Nicht unterstützt	-moz-	Ja	Ja

CSS-Syntax

/*　Um in Firefox alle lesbaren <input>-Elemente auszuwählen, muss der Präfix-moz-Präfix　*/
input:-moz-read-only　{
　　background-color:　#ccc;
}
input:read-only　{
　　background-color:　#ccc;
}

Hinweis: Dieser Selektor wählt nicht nur <input>-Elemente mit der Eigenschaft 'readonly' aus, sondern auch alle Elemente, die vom Benutzer nicht editiert werden können.