CSS Referenzhandbuch

CSS @Regel(RULES)

Vollständiges Verzeichnis der CSS-Attribute

CSS Funktionen (Functions)CSS Selector大全

CSS :out-von-range-Selektor

:out-von-Die range CSS Pseudo-Klasse stellt ein <input>-Element dar, dessen aktueller Wert außerhalb des durch die Eigenschaften min und max bestimmten Bereichs liegt. Hinweis: Diese Pseudo-Klasse ist nur für Elemente geeignet, die (oder akzeptieren können) einen Wertebereich festgelegt haben. Fehlt diese Einstellung, ist der Wert des Elements irrelevant für "in-range” und “out-range”.

Vollständiges Referenzhandbuch für CSS-Selektoren

Online-Beispiel

Stellen Sie den angegebenen Stil ein, wenn der eingegebene Wert außerhalb des angegebenen Bereichs liegt:

Beispiel

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">　
<title>Grundlagen-Tutorial(oldtoolbag.com)</title>/title>　
<style>
input:out-von-range
{
　　　　border:2px fest blau;
}
</>style>
</>head>
<body
<h3> :out-von-range-Selektor-Beispiel demonstrieren.</h3>
<input type="number" min="8" max="18" value="20"　/>
<p>Geben Sie einen Wert im input ein (kleiner　8　oder größer　18), um die Änderungen der Styles zu sehen.</p>
</body>
</html>

Testen Sie es heraus ‹/›

Definition und Verwendung

:out-von-Der range-Selektor wird verwendet, um Stile anzuzeigen, die bei Werten außerhalb des angegebenen Bereichs für die Werte der Etiketten angegeben werden.

Hinweis: 　:out-von-Der range-Selektor wirkt sich nur auf Elemente aus, die Werte außerhalb eines bestimmten Bereichs angeben können, z.B. die min- und max-Attribute eines input-Elements.

Browserkompatibilität

Die Zahlen in der Tabelle geben die Versionsnummer des ersten Browsers an, der diese Eigenschaft unterstützt.

Selektor
:out-von-range	10.0	Nicht unterstützt	28.0	5.2	11.0

CSS-Syntax

/*　Diese Pseudo-Klasse kann beliebige <input> auswählen, aber nur, wenn das Element einen Wertebereich angegeben hat und der Wert des Elements im angegebenen Bereich liegt.　*/
input:out-von-range {
　　background-color: rgba(255, 0, 0, 0.25);
}

Dieser Pseudo-Klasse wird verwendet, um dem Benutzer eine visuelle Hinweis zu geben, dass der aktuelle Wert des Eingabefelds außerhalb des erlaubten Bereichs liegt.