Wie kann ich Farbverlauf bei border erzeugen?

[Newbie]

Hi,
ich bin soeben mal wieder auf ein Problem gestoßen :/
In meiner CSS-Datei habe ich u.a. folgende Befehle:

	/* Hintergrundfarbe für Opera, weil er kein Farbverlauf unterstützt */  
	background-color:#808080;  
	  
	/* Farbverlauf für Internet Explorer */  
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#808080', endColorstr='#222222');  
  
	/* Farbverlauf für Firefox */  
	background: -moz-linear-gradient(top, #808080, #222222);  
  
	/* Farbverlauf für Safari */  
	background: -webkit-gradient(linear, left top, left bottom, from(#808080), to(#000000));  
      

Hierdurch wird für die entsprechenden Browser jeweils ein Farbverlauf erstellt...jetzt habe ich um den DIV-Bereich, wo dieser Farbverlauf als Hintergrund genutzt wird, einen Rahmen mit dem Befehl "border: 1px;" und würde auch gerne den Farbverlauf mit Hilfe der o.g. Befehle auf den Rahmen anwenden. Ist das möglich? Und wenn, wie muss ich das machen? Habe es bereits mit border: 1px moz-linear-gradient(top, #808080, #222222); probiert, doch so scheint es leider nicht zu funktionieren -.-
Wäre toll, wenn ihr mir wiedereinmal weiterhelfen könntet ;)

Mit freundlichen Grüßen,
Newbie

[Deus Figendi]

Hierdurch wird für die entsprechenden Browser jeweils ein Farbverlauf erstellt...jetzt habe ich um den DIV-Bereich, wo dieser Farbverlauf als Hintergrund genutzt wird, einen Rahmen mit dem Befehl "border: 1px;" und würde auch gerne den Farbverlauf mit Hilfe der o.g. Befehle auf den Rahmen anwenden. Ist das möglich? Und wenn, wie muss ich das machen? Habe es bereits mit border: 1px moz-linear-gradient(top, #808080, #222222); probiert, doch so scheint es leider nicht zu funktionieren -.-

soweit ich weiß gibt es derzeit zwei Möglichkeiten einen Farbverlauf auf einen Rahmen zu bringen:
Variante 1:
Jede Farbe im Verlauf einzeln definieren, geht z.B. so:
border-colors:#fff #ffe #ffd #ffc #ff9 #ff8 #ff7 #ff6 #ff5 #ff4 #ff3 #ff2 #ff1 #ff0
Oder mit Bildern border-image
Hier ist ein nettes deutschsprachiges Video-Tutorial

[Newbie]

soweit ich weiß gibt es derzeit zwei Möglichkeiten einen Farbverlauf auf einen Rahmen zu bringen:
Variante 1:
Jede Farbe im Verlauf einzeln definieren, geht z.B. so:
border-colors:#fff #ffe #ffd #ffc #ff9 #ff8 #ff7 #ff6 #ff5 #ff4 #ff3 #ff2 #ff1 #ff0
Oder mit Bildern border-image
Hier ist ein nettes deutschsprachiges Video-Tutorial

Danke für den Youtube-Link, da erfährt man ja einiges über CSS3, doch leider geht das mit dem Farbverlauf bei border nicht :(
Hat noch jmd eine Idee wie man das machen kann?

mfg,
newbie

[ChrisB]

Hi,

leider geht das mit dem Farbverlauf bei border nicht :(
Hat noch jmd eine Idee wie man das machen kann?

Wenn das Element nicht transparent sein soll, sondern eine Hintergrundfarbe oder -bild hat - dann könntest du es in ein weiteres Element hinein tun, diesem wiederum einen Farbverlauf als Hintergrund geben, und über damit etwas padding einen Rahmen simulieren.

MfG ChrisB

[Gunnar Bittersmann]

@@Newbie:

nuqneH

Habe es bereits mit border: 1px moz-linear-gradient(top, #808080, #222222); probiert, doch so scheint es leider nicht zu funktionieren -.-

Nee, so nicht.

“[Gradients] can be used any place an _image_ can currently be used.” [CSS3-IMAGES-ED §5] (Hervorhebung von mir)

Also nicht 'border', sondern 'border-image' wäre die Eigenschaft der Wahl. [CSS3-BACKGROUND §5]

Qapla'