Hallo,
ich habe ein TEmplate in Joomla und dort ist der Hintergrund mit einem schrägen Strichhintergrund. Dieser wird aus einem teilweise transparenten png gebildet. JEtzt soll der Hintergrund auch noch einen Farbverlauf haben. Wenn ich allerdings beide Angaben mache, nimmt er mir entweder den Farbverlauf, oder das Hintergrundbild. Aber nicht beides.
Geht das nicht? Oder hat jemand einen Tipp, wie ich das hinbekommen kann?
Danke und lg Nadja
Kombination von CSS Farbverlauf und HIntergrundgrafik
-
In CSS 2.1 kann man einem Element entweder eine Farbe oder ein Bild als Hintergrund zuweisen. Beides geht nicht. Erst ab CSS3 ist das vorgesehen.
-
ja dann mach doch nen wrapper drum und gib dem einen des bild und dem wrapper den farbverlauf
-
joa manches mal zaheln sich 12 jahre erfahrung halt aus
-
In CSS 2.1 kann man einem Element entweder eine Farbe oder ein Bild als Hintergrund zuweisen. Beides geht nicht. Erst ab CSS3 ist das vorgesehen.
Bitte? Das geht schon seit Jahren, unabhängig davon ab welcher CSS-Version das unterstützt wurde, in jedem Browser.
Man kann entweder beides getrennt schreiben:
Codebackground-color: green; background-image: url(bild.png); background-position: right; background-repeat: no-repeat;oder auch beides auf einer Zeile:
Codebackground: green url(bild.png) right no-repeat;Die Frage betraf aber keine Hintergrundfarbe sondern einen Hintergrundfarbverlauf. Auch das geht in einem Element:
Codebackground: #6cab26; background-image: url(bild.png); /* fallback */ background-image: url(bild.png), -webkit-gradient(linear, left top, left bottom, from(#444444), to(#999999)); /* Saf4+, Chrome */ background-image: url(bild.png), -webkit-linear-gradient(top, #444444, #999999); /* Chrome 10+, Saf5.1+ */ background-image: url(Ibild.png), -moz-linear-gradient(top, #444444, #999999); /* FF3.6+ */ background-image: url(bild.png), -ms-linear-gradient(top, #444444, #999999); /* IE10 */ background-image: url(bild.png), -o-linear-gradient(top, #444444, #999999); /* Opera 11.10+ */ background-image: url(bild.png), linear-gradient(top, #444444, #999999); /* W3C */Nur der IE<=9 hat hierbei seine Macken, bei dem geht das nicht.
