Gradienti CSS orizzontali?

Question

Desidero avere una sfumatura come sfondo della mia pagina web. Ho capito come rendere verticale la sfumatura, ma voglio che sia orizzontale.

background-image: -webkit-gradient(linear, 0% 25%, 0% 0%, from(rgb(176, 196, 222)), to(rgb(255, 255, 255))); 
background-image: -moz-linear-gradient(center bottom, rgb(153, 255, 51) 25%, rgb(255, 102, 51) 80%); 

Answer 1

Per -webkit-gradient si definisce la direzione utilizzando i due punti (l'argomento 2 ° e 3 ° nel tuo caso), e per -moz-linear-gradient E 'definita dal punto di partenza unico (il primo argomento). Quindi, per trasformare questi gradienti a quelle orizzontali, faresti:

background-image: -webkit-gradient(linear, 25% 0%, 0% 0%, from(rgb(176, 196, 222)), to(rgb(255, 255, 255))); 
background-image: -moz-linear-gradient(center right, rgb(153, 255, 51) 25%, rgb(255, 102, 51) 80%); 

(Potrebbe essere necessario modificare i tuoi valori di colore perché sei definire i punti in modo diverso per ogni browser Potrebbe essere più facile se si imposta la. punta a center right, center left per Webkit e corrisponde a Mozilla.)