English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
in-Die range CSS Pseudo-Klasse repräsentiert ein input-Element, dessen aktueller Wert im Bereich der Eigenschaften min und max liegt. Hinweis: Diese Pseudo-Klasse ist nur für Elemente geeignet, die (oder akzeptieren können) einen Wertebereich zu haben. Fehlt diese Einstellung, ist der Wert des Elements irrelevant "in-range” und “out-range”
Vollständiges Referenzhandbuch für CSS-Selektoren
Wenn der Wert im Bereich liegt, wird der angegebene Stil festgelegt:
<!DOCTYPE html>
<html
<head
<meta charset="utf-8">
<title>Grund教程(oldtoolbag.com)</title>/<title
<style
input:in-Bereich
{
border:2px fest orange;
}
</<style
</<head
<body
<h3>:in-range-Selektor-Beispiel demonstrieren.</h3>
<input type="number" min="8" max="18" value="9" />
<p>Geben Sie einen Wert im input ein (kleiner als 8 oder größer als 18), um die Änderungen am Stil zu sehen.</p>
</body>
</html>Testen Sie es heraus ‹/›:in-Der range-Selektor wird verwendet, um Stile anzuzeigen, wenn der Wert eines Etiketts im angegebenen Bereich liegt.
Hinweis: :in-Der range-Selektor wirkt sich nur auf Elemente aus, die einen Bereich angeben können, z.B. die min- und max- Attribute eines input-Elements.
Die Zahlen in der Tabelle geben die erste Browser-Version an, die das Attribut unterstützt.
| Selektor | |||||
|---|---|---|---|---|---|
| :in-Bereich | 10.0 | Nicht unterstützt | 28.0 | 5.2 | 11.0 |
/* Dieser Pseudo-Klasse kann beliebige <input> selektiert werden, aber nur, wenn das Element einen Wertebereich angegeben hat und der Wert des Elements im angegebenen Bereich liegt.*/
input:in-range {
background-color: rgba(0, 255, 0, 0.25);
}Dieser Pseudo-Klasse wird verwendet, um dem Benutzer eine visuelle Hinweis zu geben, dass der aktuelle Wert des Eingabefelds im erlaubten Bereich liegt.
CSS Selektor :out-von-Bereich