Existe alguma diferença entre usar border:none e border:0 ?
Você está vendo a versão anterior da nova experiência da Alura que estamos preparando para você. Em breve, ela ganha uma identidade visual novinha totalmente pensada em potencializar seus estudos!
Solucionado
Existe alguma diferença entre usar border:none e border:0 ?
Oi, Kleber, tudo bem?
Então, aparentemente ambas as possibilidades se referem a não ter borda no seu estilo, certo? Sim e não. Depende de como estará o seu estilo. Vê esse exemplo:
<div class="zero">
<div class="width">
<h1>Valor da bordar é zero e largura da borda é 3px.</h1>
</div>
<div class="style">
<h1>O valor da borda é 0 e o style é dotted</h1>
</div>
</div>
<div class="none">
<div class="width">
<h1>O valor da borda é none e o width dela é de 3px.</h1>
</div>
<div class="style">
<h1> O valor da borda é none e o style é dotted.</h1>
</div>
</div>div {
border: 1px solid black;
margin: 1em;
}
.zero div
{border: 0;
}
.none div {
border: none;
}
div.width {
border-width: 3px;
}
div.style {
border-style: dotted;
}
O que acontece aqui é que, apesar de eu ter usado o border: none, ele não respeita e acresceta uma borda estilizada, dotted . Tem que ficar atento às sobreposições de estilo e valores que estão depois do seu border: none;
Como none e 0 afetam propriedades diferentes (border-style e border-width), elas se comportarão de maneira diferente quando uma regra mais específica definir apenas o estilo ou apenas a largura.
Então, a priori elas funcionam com o mesmo objetivo, mas dependerá dos outros valores que você irá usar pra definir e estilizar o seu elemento.
Espero ter te ajudado :}