Propriedade outline-style

A propriedade outline-style define o estilo do contorno externo - uma borda que não ocupa espaço.

Sintaxe

seletor {
	outline-style: valor;
}

Valor	Descrição
`solid`	Linha sólida.
`dotted`	Contorno em forma de pontos.
`dashed`	Contorno em forma de traços.
`ridge`	Contorno em forma de linha em relevo.
`double`	Contorno em forma de linha dupla. Para ver o efeito, a espessura do contorno deve ser de pelo menos `3px`.
`groove`	Contorno côncavo.
`inset`	Contorno rebaixado.
`outset`	Contorno elevado.
`none`	Ausência de contorno.

Valor padrão: none.

<div id="elem"></div>

#elem {
	outline-width: 1px;
	outline-style: solid;
	outline-color: black;
	width: 300px;
	height: 100px;
}

<div id="elem"></div>

#elem {
	outline-width: 1px;
	outline-style: dotted;
	outline-color: black;
	width: 300px;
	height: 100px;
}

<div id="elem"></div>

#elem {
	outline-width: 1px;
	outline-style: dashed;
	outline-color: black;
	width: 300px;
	height: 100px;
}

<div id="elem"></div>

#elem {
	outline-width: 3px;
	outline-style: ridge;
	outline-color: black;
	width: 300px;
	height: 100px;
}

<div id="elem"></div>

#elem {
	outline-width: 3px;
	outline-style: double;
	outline-color: black;
	width: 300px;
	height: 100px;
}

<div id="elem"></div>

#elem {
	outline-width: 3px;
	outline-style: groove;
	outline-color: black;
	width: 300px;
	height: 100px;
}

<div id="elem"></div>

#elem {
	outline-width: 3px;
	outline-style: inset;
	outline-color: black;
	width: 300px;
	height: 100px;
}

<div id="elem"></div>

#elem {
	outline-width: 3px;
	outline-style: outset;
	outline-color: black;
	width: 300px;
	height: 100px;
}