CSS :out-of-range Pseudo-clase

La pseudo-clase :out-of-range da estilo a los elementos que tienen limitaciones de rango cuando el valor del elemento está fuera del rango especificado.

INFO

El selector :out-of-range solo funciona para <input> elementos con los atributos min y/o max.

Versión

Selectores Nivel 4

Sintaxis

Ejemplo de sintaxis de CSS :out-of-range

css

:out-of-range {
  css declarations;
}

Ejemplo del selector :out-of-range:

Ejemplo de código CSS :out-of-range

html

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
    <style>
      input:out-of-range {
        border: 3px solid #8ebf42;
      }
    </style>
  </head>
  <body>
    <h2>:out-of-range selector example</h2>
    <form>
      <input type="number" min="1" max="12" value="15" />
    </form>
  </body>
</html>

Try it Yourself »

Practice

¿Cuál es el propósito del selector de pseudo-clase :out-of-range en CSS?

Se utiliza para dar estilo a formularios HTML con elementos de entrada que contienen valores fuera de un rango especificado.Se utiliza para dar estilo a formularios HTML con elementos de entrada que contienen valores dentro de un rango especificado.Se utiliza para hacer que los elementos desaparezcan de una página web cuando no están dentro del área visible.Se utiliza para aplicar efectos o animaciones a un elemento cuando un usuario interactúa con él.Se utiliza para dar estilo a controles de formulario que están habilitados.

CSS :out-of-range Pseudo-clase ​

Versión ​

Sintaxis ​

Ejemplo del selector :out-of-range: ​

Practice ​

CSS :out-of-range Pseudo-clase

Versión

Sintaxis

Ejemplo del selector :out-of-range:

Practice