Borde con gradiente en CSS3

Hola a todos.

Por diseño necesité un gradiente en el borde para una barra de progreso... entonces así sería el código CSS.


border-width: 0px 25px 0px 0px;
    border-style: solid;
    -webkit-border-image: 
        -webkit-gradient(linear, 100% 0, 0 0, from(green), to(red)) 1 100%;
    -webkit-border-image: 
        -webkit-linear-gradient(right, green, red) 1 100%;
    -moz-border-image:
        -moz-linear-gradient(right, green, red) 1 100%;  
    -o-border-image:
        -o-linear-gradient(right, green, red) 1 100%;
    border-image:
        linear-gradient(to right, green, red) 1 100%; 

Espero les sirva.

Sean felices! :) Y siéntanse libres de opinar ;)

No hay comentarios:

Publicar un comentario