Provavelmente essa pode ser uma pergunta repetida, mas como não sei o nome do efeito não consigo achar nada sobre ele, o efeito que quero fazer na borda é exatamente igual ao da imagem abaixo:
- Como posso fazer esse efeito?
- Qual o nome dele?
Stack Overflow em Português é um site de perguntas e respostas para programadores profissionais e entusiastas. Leva apenas um minuto para se inscrever.
Inscreva-se para participar desta comunidadeProvavelmente essa pode ser uma pergunta repetida, mas como não sei o nome do efeito não consigo achar nada sobre ele, o efeito que quero fazer na borda é exatamente igual ao da imagem abaixo:
Eu faria uma div
com tamanho fixo, deixando o backgound
gradiente linear:
HTML
<div class="linha"></div>
CSS
.linha {
margin: 10px 0;
height: 2px;
background: black;
background: -webkit-gradient(linear, 0 0, 100% 0, from(white), to(white), color-stop(50%, black));
}
Exemplo:
.linha {
margin: 10px 0;
height: 2px;
background: black;
background: -webkit-gradient(linear, 0 0, 100% 0, from(white), to(white), color-stop(50%, black));
}
<div class="linha"></div>
Complementando, eu faria assim meu hr
:
hr{
border: 0;
height: 1px;
background-image: linear-gradient(to right, transparent, black, transparent);
}
<hr>
Acredito ser mais simples esta solução, agora é só escolher a cor desejada e colocar onde esta o black