• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Wie schwarz-blau Gradienten als Hintergrundbild mit CSS für alle Browserkonstruieren?

P

pstein

Neues Mitglied
Die Webseite

FireFTP - The Free FTP Client for Mozilla Firefox

zeigt einen interessanten Effekt.
Da wird der Hintergrund von oben nach unten als schwarz-blau Verlaufs-Gradient konstruiert und zwar mit CSS.

Ich kannte solche Effekte nur als gestretchte Hintergundbilder.
Anscheinend geht das auch mit CSS und zwar für IntExplorer, Firefox und Chrome!!!

Wie geht das eigentlich genau?
Wenn ich mir die CSS der obigen Seite ansehe und nachbaue mit

html, body {
background: #121d78;
color: #eee;
background-image: -moz-linear-gradient(top,#000000,#121d78);
background-repeat: no-repeat;
background-image: -webkit-gradient(linear,left top,left bottom,from(#000000),to(#121d78));
filter: progid:DXImageTransform.Microsoft.Gradient(startColorStr=#000000,endColorStr=#121d78);
-ms-filter: "progid:DXImageTransform.Microsoft.Gradient(startColorStr=#000000, endColorStr=#121d78)";
font : 12px/16px Helvetica, sans-serif;
}


....dann funkioniert das nicht (zumindest nicht unter Firefox und in IntExp gibt es ein ActiveX warning).

Wie alos geht das wirklich vollständig für all browser?

Peter
 
Bei mir geht es:
HTML: 
<html>
<head>
<style>
body {
    margin: 0 auto;
    width: 780px;
}

html, body {
    background: -moz-linear-gradient(center top , #000000, #121D7 no-repeat scroll 0 0 #121D78;
    color: #EEEEEE;
    font: 12px/16px Helvetica,sans-serif;
}
</style>
</head>
<body>
</body>
</html>
 
Hallo Peter,

mit CSS3 kannst Du eine Menge Effekte realisieren. Ich habe bei uns im Blog einen kleinen Artikel zum Thema Background-Pattern geschrieben. Vieleicht ist es eine Inspiration für dich.

Grüße aus Hannover
Stephan
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben