background con gradiente "a strisce"...

**alx17** · 08-05-2013, 15:25

Salve a tutti

Ho iniziato un progetto e voglio impostare il colore di sfondo a gradienti che sfumi dal più intenso (in basso) al meno intenso (verso l'alto).

Per risparmiare tempo mi sono affidato a uno dei tanti generator online (nello specifico quello di microsoft). E' strano però che mi viene tutto "a strisce". In pratica lo schermo viene diviso in tante striscioline orizzontali, ognuna che rende in piccolo il gradiente come io lo ho impostato sul generator.

La cosa strana è che se imposto la diffusione del colore in diagonale (invece che in verticale), tipo "top-right", "top-left", etc, il tutto funziona.

Ho provato anche con altri generator ma il problema rimane e ho controllato più volte il codice css generato ma non mi è sembrato di notare errori.

Posto il css e l'html (anche se sto ancora definendo soltanto lo sfondo del body)

css:

body {
/* IE10 Consumer Preview */
background-image: -ms-linear-gradient(top, #FFFFFF 0%, #00A3EF 100%);

/* Mozilla Firefox */
background-image: -moz-linear-gradient(top, #FFFFFF 0%, #00A3EF 100%);

/* Opera */
background-image: -o-linear-gradient(top, #FFFFFF 0%, #00A3EF 100%);

/* Webkit (Safari/Chrome 10) */
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #FFFFFF), color-stop(1, #00A3EF));

/* Webkit (Chrome 11+) */
background-image: -webkit-linear-gradient(top, #FFFFFF 0%, #00A3EF 100%);

/* W3C Markup, IE10 Release Preview */
background-image: linear-gradient(to bottom, #FFFFFF 0%, #00A3EF 100%);

}

html:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

<title>Case vacanze Vieste</title>
<meta name="description" content="Case vacanze a Vieste - A pochi passi dal mare a prezzi imbattibili" />

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

<link rel="stylesheet" href="paola_style.css"/>

</head>

<body>

</body>
</html>

Qualche suggerimento..???

Grazie mille.

alx17

**carlomarangoni** · 08-05-2013, 16:24

codice:

body, html {
	width:100%;
	height:100%;
 /* IE10 Consumer Preview */ 
 background-image: -ms-linear-gradient(top, #FFFFFF 0%, #00A3EF 100%);

 /* Mozilla Firefox */ 
 background-image: -moz-linear-gradient(top, #FFFFFF 0%, #00A3EF 100%);

 /* Opera */ 
 background-image: -o-linear-gradient(top, #FFFFFF 0%, #00A3EF 100%);

 /* Webkit (Safari/Chrome 10) */ 
 background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #FFFFFF), color-stop(1, #00A3EF));

 /* Webkit (Chrome 11+) */ 
 background-image: -webkit-linear-gradient(top, #FFFFFF 0%, #00A3EF 100%);

 /* W3C Markup, IE10 Release Preview */ 
 background-image: linear-gradient(to bottom, #FFFFFF 0%, #00A3EF 100%);

 }

ATTENZIONE Quando posti del codice devi usare gli appositi tag [code]...&# 91;/code]

**Nobody33** · 08-05-2013, 20:07

Ho iniziato un progetto e voglio impostare il colore di sfondo a gradienti che sfumi dal più intenso (in basso) al meno intenso (verso l'alto).

photoshop...risparmi tempo, nervi e qualche byte.

**carlomarangoni** · 09-05-2013, 01:16

Originariamente inviato da Nobody33
photoshop...risparmi tempo, nervi e qualche byte.

Sei sicuro di quello che dici? Io non credo che tu sappia molto di css

**Nobody33** · 09-05-2013, 03:02

@carlomarangoni

Sei sicuro di quello che dici? Io non credo che tu sappia molto di css

Sei libero di credere ciò che vuoi.
Inoltre, perché non glielo dai tu qualche suggerimento?

Ho solo risposto alla domanda di @alx17:

Qualche suggerimento..???

**carlomarangoni** · 09-05-2013, 15:51

Originariamente inviato da Nobody33
@carlomarangoni

Sei libero di credere ciò che vuoi.

Io non credo proprio a nulla ma deduco ciò che c'è da dedurre nella tua risposta

Inoltre, perché non glielo dai tu qualche suggerimento?

Io il suggerimento l'ho dato prima di te! Infatti se avessi saputo leggere il thread avresti visto il mio post dove ho fornito subito il codice funzionante come lui ha chiesto senza bisogno di photoshop

**Nobody33** · 09-05-2013, 17:57

@carlomarangoni

Io non credo proprio a nulla

Ti contraddici, poco sopra si legge:

Io non credo che tu sappia molto di css

Inoltre:

ma deduco ciò che c'è da dedurre nella tua risposta

Fare "deduzioni" e "credere" questo o quell'altro in base ad UNA risposta che una persona (che manco conosci [sic]) dà, è alquanto limitato.

Io il suggerimento l'ho dato prima di te

Vero.

Per finire, sarebbe opportuno lasciare fuori le questioni personali.
Ognuno può dare i suggerimenti come meglio crede.
Cosa accettare e cosa no, sta a decidere a chi pone la domanda, perché il problema è solo suo.

**carlomarangoni** · 09-05-2013, 19:51

Originariamente inviato da Nobody33
@carlomarangoni

Ti contraddici, poco sopra si legge:

Inoltre:

Fare "deduzioni" e "credere" questo o quell'altro in base ad UNA risposta che una persona (che manco conosci [sic]) dà, è alquanto limitato.

Vero.

Per finire, sarebbe opportuno lasciare fuori le questioni personali.
Ognuno può dare i suggerimenti come meglio crede.
Cosa accettare e cosa no, sta a decidere a chi pone la domanda, perché il problema è solo suo.

Ti vuoi arrampicare per forza sugli specchi per me fai pure e non mi importa neanche se cadi.

Ma lascio agli altri il giudizio di uno che consiglia Photoshop per fare css e poi continua la polemica per avere ragione.

Puoi anche finirla qui tanto io non leggero più nulla di questa discussione!

**Nobody33** · 09-05-2013, 19:58

@carlomarangoni

di uno che consiglia Photoshop per fare css

Nessuno ha consigliato photoshop per "fare" (parole sue sig. carlo) .css.

Era un suggerimento per risolvere il problema in generale, ovvero

Ho iniziato un progetto e voglio impostare il colore di sfondo a gradienti che sfumi dal più intenso (in basso) al meno intenso (verso l'alto).

Più chiaro adesso?

**Mich_** · 10-05-2013, 12:53

Questa discussione sta degenerando.

Le polemiche di questo tipo dequalificano solo chi le fa, e non danno contributi.

Chiudo questa discussione.

alx17, se le risposte non ti soddisfano (i primi post avevano contenuto valido), per favore riapri una nuova discussione.

Discussione: background con gradiente "a strisce"...

Strumenti discussione

Ricerca discussione

Visualizza

background con gradiente "a strisce"...

Permessi di invio