2010-11-23 9 views
3

Gibt es eine Möglichkeit, ie (7,8) einen Gradienten UND ein Hintergrundbild auf demselben div darzustellen?dh gradient + background-image

Der einzige Weg, wie ich es funktionierte (aber nur fast) war mit zwei Filtern, einen für den Farbverlauf und einen mit dem AlphaImageLoader - aber natürlich, dann können Sie das Bild nicht positionieren.

Das Deklarieren eines Hintergrundbilds und eines Gradientenfilters funktioniert nicht, da das Bild einfach nicht gerendert wird - nur der Farbverlauf.

Gibt es eine (vorzugsweise nicht-js) Lösung?

Wenn nicht, werde ich zurückgreifen als auch ein Hintergrundbild für die Gradienten zu verwenden, die nicht ganz so schön ist, aber auch nicht viel Unterschied machen ...

+0

Sie können einen in Ihrem bevorzugten Bildbearbeitungsprogramm erstellen oder zwei Divs mit denselben Abmessungen verwenden, eine mit dem Farbverlauf und einer Deckkraft und eine mit dem Hintergrundbild. – Kyle

+0

Danke, das sind beide mögliche Lösungen, aber ich versuche zu vermeiden, 1) unnötige Markup und 2) riesige PNGs (1040x308 +) zu verwenden. –

Antwort

6

würde ich sagen, dass das Hinzufügen eines etwas unnötigen Markups das kleinere der Übel ist. Entweder das, oder lassen IE-Benutzer ohne den Gradienten leben.

Oft ist es ein Kompromiss zwischen Semantik, Performance, Standards und Pixelperfektion, Ihr Design zum Laufen zu bringen. Es war schwer für mich, diese Tatsache zu akzeptieren, aber es hat mich zu einem besseren Front-End-Entwickler gemacht - ich kann schneller arbeiten und ich kann entscheiden, welche Metrik in einem bestimmten Fall wichtig ist.

+3

Ich stimme zu, wenn IE-Benutzer weiterhin einen veralteten, schrecklichen Dämonen-Browser verwenden, dann bekommen sie, was sie benutzen. – Kyle

+1

Leider keine Option in einer Unternehmensumgebung für den Fall, dass Sie Ihren Job behalten möchten. – nottinhill

+2

@StephanKristyn Klingt wie eine giftige Umgebung, wenn ein Farbverlauf etwas ist, um einen Job zu verlieren. – Magnar