Selecting input Elements with Range Limitations
Description
The :in-range selector matches input elements
that are in range and the :out-of-range selector selects those that are not.
Example
The following code uses the :in-range and :out-of-range Selectors.
<!DOCTYPE HTML>
<html>
<head>
<style>
:in-range {<!--from www . j av a 2 s . co m-->
outline: medium solid green;
}
:out-of-range: {
outline: medium solid red;
}
</style>
</head>
<body>
<form method="post" action="http://example.com/form">
<p>
<label for="price"> $ per unit in your area: <input
type="number" min="0" max="10" value="11" id="price" name="price" />
</label>
</p>
<input type="submit" value="Submit" />
</form>
</body>
</html>
Chrome and Opera support the :in-range selector.