Degradado de color

1. Degradados lineales

El módulo CSS Image Values and Replaced Content Module Level 3 permite aplicar degradados lineales y radiales. Las propiedades utilizadas se reconocen perfectamente en todos los navegadores recientes.

background: linear-gradient

punto de partida;

color inicial;

color final;

Comentarios

El valor punto de partida se determina con top (por defecto), left, right o bottom. También puede utilizar grados para definir el ángulo del eje según el cual se realizará el degradado.

Ejemplo


<!DOCTYPE html> 
<html lang="es"> 
<head> 
    <title>Degradados</title> 
    <meta charset="UTF-8" /> 
    <style> 
         .degradado-blanco-negro { 
               width: 500px; 
               border: 1px solid #333; 
               padding: 5px;  
               background: linear-gradient(180deg, white , black ); 
         }  
         div.degradado-blanco-negro p {  
               margin: 0;  
         }  
    </style>  
</head>  
<body>  
    <div...
Si desea saber más, le proponemos el siguiente libro:
couv_RIT35HTM.png
60-signet.svg
Versión impresa
20-ecran_lettre.svg
Versión online
41-logo_abonnement.svg
En ilimitado con la suscripción ENI
130-boutique.svg
En la tienda oficial de ENI
Anterior
Aplicar un color de fondo
Siguiente
Opacidad de las cajas