Beim zweiten Hintergrund handelt es ich nicht um einen Balken der per Gradient generiert wird, sondern um eine echte Grafik. Diese Grafik soll genau unterhalb des Gradient Balkens platziert werden. Nun muss ich ja irgendwie die Y-Position angeben, ab welcher die zweite Grafik platziert werden muss. Wo kann ich das den angeben? Kannst du mir hier vielleicht ein kleines Code-Beispiel geben?
Im ersten Antwortposting von Gunnar Bittersmann wurdest du bereits auf background-position hingewiesen.
Die ersten Werte vor dem Komma beziehen sich hier wieder auf den ersten Hintergrund (ob CSS Gradient oder „echte“ Grafik spielt keine Rolle), die zweiten Werte auf den Zweiten usw.
Das Ganze kann man auch in die background-Kurzschreibweise packen, was mir persönlich mehr zusagt: background: linear-gradient(…) no-repeat, url(…) 23px 42px;
Lässt man in der Kurzschreibweise einen Wert weg, erhält die entsprechende Eigenschaft – anstelle des für den ersten Hintergrund definierten Wertes – automatisch ihren Initialwert.
3.)
Am liebsten wäre mir, wenn der schwarze Balken einen gesprengelten Verlauf hätte. Früher hab ich das immer so gelöst, dass ich eine Grafik die das gewünschte Muster hat von links nacht rechts gekachelt habe. Ist so ein gesprengeltes Muster mit Hilfe von Gradienten überhaupt umsetzbar? Falls ja, wie?Ja, wahrscheinlich..
Was meinst du mit "Ja, wahrscheinlich.."? Kannst du mir hier ein kleines Beispiel geben?
Ich kann nur raten, was du unter einem „gesprengelten“ Muster verstehst.
Anregungen, wie man so etwas machen kann, hast du ja genug bekommen.