Código de CSS - Ejemplo de asignar un degradado a un elemento con CSS3 y HTML5

Imágen de perfil

Ejemplo de asignar un degradado a un elemento con CSS3 y HTML5gráfica de visualizaciones


CSS

estrellaestrellaestrellaestrellaestrella(1)
Publicado el 29 de Mayo del 2013 por Xavi
10.011 visualizaciones desde el 29 de Mayo del 2013. Una media de 42 por semana
Código que muestra como asignar un degradado de fondo a una capa y a un botón.

Versión 1
estrellaestrellaestrellaestrellaestrella(1)

Publicado el 29 de Mayo del 2013gráfica de visualizaciones de la versión: Versión 1
10.012 visualizaciones desde el 29 de Mayo del 2013. Una media de 42 por semana
estrellaestrellaestrellaestrellaestrella
estrellaestrellaestrellaestrella
estrellaestrellaestrella
estrellaestrella
estrella

Puede ver el ejemplo de dicho código en: css_degradado.php
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <style>
        div{
            height:200px;
            width:600px;
            padding:10px;
        }
        input[type=button]{
            padding:10px;
        }
        .degradado{
            background: -webkit-gradient(linear, left top, left bottom, from(#cccccc), to(#808080));
            background: -moz-linear-gradient(center top , #cccccc, #808080);
            background: -o-linear-gradient(center top , #cccccc, #808080);
            background: -ms-linear-gradient(center top , #cccccc, #808080);
            background: linear-gradient(center top , #cccccc, #808080);
        }
    </style>
</head>
 
<body>
 
<div class='degradado'>
    El fonde de este div tiene un degradado
    <p>
        <strong>linear-gradient (origen del degradado, color origen, color destino)</strong>
        <p>
            origen del degradado: tiene que indicar donde empieza el degradado (center top, top left, ...)
            <br>color origen: determina el color inicial (#cccccc)
            <br>color destino: determina el color final del degradado (#808080)
        </p>
    </p>
</div>
 
<p>
    <input type="button" class='degradado' value="Ejemplo de botón">
</p>
 
</body>
</html>



Comentarios sobre la versión: Versión 1 (1)

Jorgito
02 de Marzo del 2018
estrellaestrellaestrellaestrellaestrella
No ha dejado ningún comentario
Responder

Comentar la versión: Versión 1

Nombre
Correo (no se visualiza en la web)
Valoración
Comentarios
Es necesario revisar y aceptar las políticas de privacidad

http://lwp-l.com/s2386  
Revisar política de publicidad