Erst das lesen, dann nochmal herkommen und rummotzen.
Natürlich stelle ich hier browserspezifische Implementierungen des Standards vor. Mehr als Implementierungsentwürfe darf es übrigens auch noch gar nicht geben, vor allem, weil sie ja noch Einfluss auf den Standard haben können. Erst wenn der Standard abgesegnet ist, gibt es auch eine standardisierte Implementierung. Bis es soweit ist, müssen wir uns mit dem zufrieden geben, das wir vorgesetzt bekommen.

Jap, natürlich. Du kannst z.B. einfach rgba(0,0,0,0) oder transparent als einen der Farbwert-Parameter benutzen.

wie bindet man den HG dann ein, wenn man die definitionen hat?

Danke für deine Antwort.
Ich hab es reingeschrieben

1
2
3
4

div.rad_grad {
background:-moz-radial-gradient(center, #fff, #adf); /* Firefox */
background:-webkit-gradient(radial, center center, 80, center center, 400, from(#fff), to(#adf)); /* Safari, Chrome */
}

und der HG ändert sich nicht.
Was mache ich falsch?
Danke

also ich hab es ungefähr so:

1
2
3
4
5

@import "menu/menu_style.css";>
div.rad_grad {
background:-moz-radial-gradient(center, #fff, #adf); /* Firefox */
background:-webkit-gradient(radial, center center, 80, center center, 400, from(#fff), to(#adf)); /* Safari, Chrome */
}

<div class ="div.rad_grad"
RESTLICHE SEITE

klappt aber nicht. woran könnte das liegen?
schönen Dank!

Hi Chris, sry ich mach tagsüber auch noch andere Sachen
Also ich weiß nicht genau, wo du das oben her hast aber es sieht mir ziemlich falsch aus.. lies dir doch mal das hier bisschen durch http://de.selfhtml.org/css/formate/einbinden.htm da wird gezeigt, wie man CSS richtig einbindet. Wenn du dann immer noch nicht weiterkommst, kannst du mir auch ne E-Mail schreiben. Viel Erfolg

Die Möglichkeiten von CSS 3 erfüllen endlich jede Design-Träume. Schaut mal mit aktuellem Firefox oder Chrome auf diesen Blog, da sieht man in praktischer Anwendung, was alles möglich ist. Runde Ecken, Transparenzeffekte, Farbverläufe, Schatten, CSS3-Buttons. Eine wahre Freude! Wer mit dem IE vorbeikommt, kriegt nur eine Fallback-Lösung.

Hallo Manfred, danke dass du mich auf das Problem aufmerksam gemacht hast.

Folgendes:
1) Safari scheint doch noch nicht die neue Syntax zu unterstützen, ich hatte mir die extra Zeile bei den Beispielen gespart und nur im Chrome geprüft (Faulheit zahlt sich eben nur selten aus ) jedenfalls ist die Zeile wieder drin und die Beispiele funktionieren in Safari wieder prächtig.

2) Damit die Beispiele (zumindest für lineare Verläufe) auch in Opera funktioneren, brauchst du die aktuelle Beta Version 11.10, mit dem 11.0 Release wirst du keinen Erfolg haben.

3) Was die anderen Browser angeht, kann ich keine großen Auskünfte machen. Ich weiß nur, dass IE9 es derzeit nicht unterstützt. Wenn es so wäre, hätte ich ihn weiter oben mit aufgelistet.

Ich hoffe, das hilft dir weiter und danke nochmal.

@Manfred: Falls du für Opera noch eine Unterstützung des Farbverlaufes für ältere Versionen benötigst kann ich dir noch einen SVG Ansatz für den linearen Farbverlauf, den ich im letzten Jahr in meinem Blog (entschuldige die “Werbung” Norman) näher vorgestellt habe.

Vielen Dank für den Artikel. Du schreibst: “Prinzipiell haben die Verlauf-Funktionen 4 Argumente um einen Farbverlauf näher zu beschreiben. Die Argumente sind einmal linear oder gradient, welche angeben um welchen Typ von Verlauf es sich handelt.”

Muss es nicht heißen: “Die Argumente sind einmal linear oder _radial_”?

Hallo Norman,

erstmal vielen Dank für deinen Artikel.
Ich bastle gerade eine neue Homepage und wollte es mal mit dem Farbverlauf im Hintergrund probieren. Der Farbverlauf funktioniert soweit, aber nich über die gesammte seite, sondern nur pro Zeile.

Der css eintrag sieht so aus:

1
2
3
4
5
6
7
8
9
10
11
12
13
14

.body {
/* IE10 */ 
background-image: -ms-linear-gradient(bottom, #FFFFFF 0%, #2EFE5C 100%);
/* Mozilla Firefox */ 
background-image: -moz-linear-gradient(bottom, #FFFFFF 0%, #2EFE5C 100%);
/* Opera */ 
background-image: -o-linear-gradient(bottom, #FFFFFF 0%, #2EFE5C 100%);
/* Webkit (Safari/Chrome 10) */ 
background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #FFFFFF), color-stop(1, #2EFE5C));
/* Webkit (Chrome 11+) */ 
background-image: -webkit-linear-gradient(bottom, #FFFFFF 0%, #2EFE5C 100%);
/* Proposed W3C Markup */ 
background-image: linear-gradient(bottom, #FFFFFF 0%, #2EFE5C 100%);
}

und der html eintrag so:

Startseite

Willkommen

Hoffe du kannst mir helfen.

Hi!

Super Erläuterung, dafür zunächst mal DANKE!
Wenn ich aber die -moz-linear-gradient und -webkit etc. notiere und dann einen W3C check mache, sagt mir der Check, dass das nicht stimmt. Eine Idee dazu? Warum ignoriert das W3C nicht oder versteht nicht, dass die Notiation für die verschiedenen Browser nötig ist?

Der Validator sollte vor allem beim präfixfreien Wert meckern, denn linear-gradient(top, #fff, #adf) ist (mittlerweile) falsch, s. http://www.1stwebdesigner.com/css/mastering-css-gradients-in-less-than-1-hour/#comment-205142 Richtig ist linear-gradient(to bottom, #fff, #adf) oder linear-gradient(#fff, #adf)

Hallo, erstmal danke für dieses tut. Kann mir vieleicht jemand den Fehler sagen wieso der Effekt nur in moz. zu sehen ist?

#topnav_wrap {
background:-moz-linear-gradient(center top , #FF8000, #FF4000) repeat scroll 0 0 transparent;
background:-ms-linear-gradient(center top , #FF8000, #FF4000) repeat scroll 0 0 transparent;
background:-webkit-linear-gradient(center top , #FF8000, #FF4000) repeat scroll 0 0 transparent;
background:-o-linear-gradient(center top , #FF8000, #FF4000) repeat scroll 0 0 transparent;
background:linear-gradient(center top , #FF8000, #FF4000) repeat scroll 0 0 transparent;

overflow: inherit;
}

Vielen dank!

geht NICHT:
background:linear-gradient(top, #17b, #eee); /* W3C Standard */

geht:
background:linear-gradient(to bottom, #17b, #eee); /* W3C Standard */

Beste Grüsse und Danke
le Grunge

Hi, du sagst, dass die Bilder, die durch Styles ersetzt werden, und das dann weniger Zeit braucht. Das stimmt nur teilweise, denn dadurch werden die CSS-Files größer, die du dann lädst.

Gentles suggested shadowing immoral get cheap antibiotics white power bill would help tobias find the information for the longevity. Huge Selection Greensboro Order antibiotics Without Rx antibiotics Fast deliveri Cheap Buy antibiotics Cod Delivery Is any chemist selling safe antibiotics breast cancer treatment pills over the net?.