Tworzenie trójkąta w css z gradientowym tłem
Próbuję utworzyć trójkąt w css z gradientowym tłem. Jak dotąd nie odniosłem żadnego sukcesu. Czy można to zrobić, aby wywołać ten efekt widoczny na obrazku poniżej. (Trójkąt dołączony do pola Błędne hasło.)
Projektowanie w Photoshopie
To jest projekt, który mam do tej pory w HTML i CSS.
Oto css, które mam teraz dla trójkąta.
.error-triangle {
wwidth: 0;
height: 0;
border-top: 10px solid transparent;
border-bottom: 10px solid transparent;
border-right: 10px solid blue;
margin-top: 64px;
margin-left: 350px;
position: fixed;
-webkit-box-shadow: 0 0 3px rgba(102,65,65,.25), 2px 3px 5px rgba(70,34,34,.25), inset 1px 2px rgba(255,255,255,.25);
-moz-box-shadow: 0 0 3px rgba(102,65,65,.25), 2px 3px 5px rgba(70,34,34,.25), inset 1px 2px rgba(255,255,255,.25);
box-shadow: 0 0 3px rgba(102,65,65,.25), 2px 3px 5px rgba(70,34,34,.25), inset 1px 2px rgba(255,255,255,.25);
background-image: -webkit-linear-gradient(bottom, #eb6767, #d94040 35%, #eb6767);
background-image: -moz-linear-gradient(bottom, #eb6767, #d94040 35%, #eb6767);
background-image: -o-linear-gradient(bottom, #eb6767, #d94040 35%, #eb6767);
background-image: -ms-linear-gradient(bottom, #eb6767, #d94040 35%, #eb6767);
background-image: linear-gradient(to top, #eb6767, #d94040 35%, #eb6767);
}
Używałem tegosamouczek na temat sztuczek CSS.