manual de referência do CSS

regra @regra(RULES)

大全 de atributo do CSS

Funções CSS Manual Completo de Seletores CSS

CSS :out-of-Seletor range

:out-of-O pseudo-classe CSS range representa um elemento <input> cujo valor atual está fora do intervalo definido pelos atributos min e max. Nota: Este pseudo-classe só é aplicável a elementos que possuem (ou podem aceitar) uma configuração de intervalo de valores. Se falta essa configuração, o valor do elemento não importa para 'in-range” e “out-range”

Completo Guia de Seletor CSS

Exemplo Online

Defina o estilo quando o valor inserido estiver fora do intervalo especificado:

Exemplo

<!DOCTYPE html>
<html
><head
<meta charset="utf-8">　
<title>Manual Básico(oldtoolbag.com)</title>/><title　
<style
input:out-of-range
{
　　　　border:2px sólido azul;
}
</><style
</><head
<body
<h3> :out-of-Exemplo de seletor range CSS./h3>
<input type="number" min="8" max="18" value="20"　/>
<p>Insira um valor no input (menor　8　ou maior　18), veja as mudanças no estilo.</p>
</body>
</html>

Teste e veja ‹/›

Definição e Uso

:out-of-O seletor range é usado para estilos exibidos quando o valor da etiqueta está fora do intervalo especificado.

Atenção: 　:out-of-O seletor range atua apenas em elementos que podem especificar valores fora do intervalo, como os atributos min e max de um elemento input.

Compatibilidade do navegador

Os números na tabela representam a primeira versão do navegador que suporta essa propriedade.

Seletor
:out-of-range	10.0	Não suportado	28.0	5.2	11.0

Sintaxe CSS

/*　Este pseudo-classe pode selecionar qualquer <input>, mas só é válido quando o elemento especificado tem um intervalo de valores e o valor do elemento está dentro do intervalo especificado.　*/
input:out-of-range {
　　background-color: rgba(255, 0, 0, 0.25);
}

Este pseudo-classe fornece uma sugestão visual ao usuário, indicando que o valor atual do campo de entrada está fora do intervalo permitido.

Páginas Relacionadas

CSS Seletor :in-range

Completo Guia de Seletor CSS

Funções CSS Manual Completo de Seletores CSS