Pseudoclasse optional

A pseudoclasse optional define o estilo para um input que não possui o atributo required, ou seja, esta pseudoclasse é aplicada a inputs opcionais.

Sintaxe

seletor:optional {

}

Exemplo

Vamos definir um plano de fundo cinza para o input opcional:

<form>
	<p>
		<label>Digite um número</label>
		<input type="number" required>
	</p>
	<p>
		<label>Digite um texto</label>
		<input type="text">
	</p>
</form>

input:optional {
	background-color: #D8DFE8;
}

Veja também

a pseudoclasse :default,
que define o estilo para elementos padrão
a pseudoclasse :indeterminate,
que define o estilo para botões de opção que estão em um estado indeterminado
a pseudoclasse :placeholder-shown,
que define o estilo para elementos quando o texto de placeholder é exibido
a pseudoclasse :read-only,
que define o estilo para inputs que não podem ser alterados
a pseudoclasse :required,
que define o estilo para um input que possui o atributo required
a pseudoclasse :focus-within,
que define o estilo para elementos em foco
a propriedade caret-color,
que define a cor do cursor de texto em um input