hintergrund(bild) 100% strecken
horaman
- css
0 dave0 horaman0 Der Martin0 horaman0 dave0 horaman
0 Steel0 Gunnar Bittersmann
0 dave
0 bleicher
Hi,
ich habe folgendes Problem:
Ich will,dass der Hintergrund von schwarz zu weiß verläuft (oben schwarz, unten weiß).
Ich habe ein Hintergrundbild gemalt und es eingefügt, jedoch wird das Bild dann nicht gestreckt, sondern immer wieder wiederholt. Das wiederholen will ich vermeiden. Vielleicht könnte man das ohne Hintergrundbild machen und nur über CSS?
Man kann es, so weit ich weiß, mit CSS3 machen. Aber das wollte ich vermeiden, da ich nicht weiß, ob es der Browser vom Benutzer unterstützt.
Habt ihr einen Vorschlag, wie ich mein Problem lösen könnte? Ich hoffe, ich konnte mein Problem einigermaßen verständlich schildern.
Danke
MfG
Hora
Hi,
http://webdesignerwall.com/tutorials/cross-browser-css-gradient
Sollte alle gängigen Browser abdecken.
Außer Opera :(
~dave
Hi,
danke dave, wie ich sehe, gibt es wohl keine andere Möglichkeit außer CSS3 zu benutzen. Ich hab noch folgenden Code hinzugefügt, damit sich das ganze auch vertikal streckt:
background-attachment: fixed;
Irgendwie klappt das bei mir nicht mit dem Internet Explorer 8.0. Die Farbe wird zwar angezeigt, aber gestreckt wird es nur bis zum Ende der letzten Zeile vom Code. Deshalb frage ich mich, ob der Code zu IE richtig ist.
horaman
Hallo,
danke dave, wie ich sehe, gibt es wohl keine andere Möglichkeit außer CSS3 zu benutzen. Ich hab noch folgenden Code hinzugefügt, damit sich das ganze auch vertikal streckt:
background-attachment: fixed;
das hat aber mit dem "Strecken" des Hintergrundbildes nichts zu tun - background-attachment:fixed bedeutet nur, dass das Hintergrundbild nicht mit dem Elementinhalt mitscrollen soll.
Ciao,
Martin
Du meinst das Verlauf mit CSS ging nicht über die gesamt Breite der Seite?
Welchem Element hast du den Verlauf gegeben und wie Breit ist dasbackground-attachment:
Ich sehe nicht wie das das Problem löst, wundert mich dass es scheinbar funktioniert?
»»das hat aber mit dem "Strecken" des Hintergrundbildes nichts zu tun - background-attachment:fixed bedeutet nur, dass das Hintergrundbild nicht mit dem Elementinhalt mitscrollen soll.
Ich meinte die Höhe. Über die gesamte Breite ging der Verlauf. Es sah so aus:
grau
(Verlauf)
schwarz
grau
(Verlauf)
schwarz
etc.
Und mit background-attachment gibt es nur noch einmal grau zu schwarz.
Martin: Mein Hintergrund soll immer so bleiben, wie es ist. Egal wie groß das Fenster ist
Irgendwie klappt das bei mir nicht mit dem Internet Explorer 8.0. Die Farbe wird zwar angezeigt, aber gestreckt wird es nur bis zum Ende der letzten Zeile vom Code.
Was wird gestreckt?
Auf deiner Seite ist Code sichtbar?
Ich verstehe nicht was du damit sagen willst...
Es wird kein Code angezeigt. Hab mich ein bischen falsch ausgedrückt. Ich habe meinen Hintergrund(Verlauf von grau zu schwarz) und eine kleine zentrierte Tabelle. Über und unter der Tabelle ist noch genügend Platz. Mein Hintergrund fängt aber erst da an, wo meine Tabelle anfängt und hört da auf, wo meine Tabelle aufhört. Man sieht also nur links und rechts neben der Tabelle meinen Hintergrund und oben und unten ist der Hintergrund weiß.
horaman
Hi,
Irgendwie klappt das bei mir nicht mit dem Internet Explorer 8.0. Die Farbe wird zwar angezeigt, aber gestreckt wird es nur bis zum Ende der letzten Zeile vom Code.
Was wird gestreckt?
Auf deiner Seite ist Code sichtbar?
Ich verstehe nicht was du damit sagen willst...Es wird kein Code angezeigt. Hab mich ein bischen falsch ausgedrückt. Ich habe meinen Hintergrund(Verlauf von grau zu schwarz) und eine kleine zentrierte Tabelle. Über und unter der Tabelle ist noch genügend Platz. Mein Hintergrund fängt aber erst da an, wo meine Tabelle anfängt und hört da auf, wo meine Tabelle aufhört. Man sieht also nur links und rechts neben der Tabelle meinen Hintergrund und oben und unten ist der Hintergrund weiß.
Dann ist das Element dem du den Hintergrund geben hast einfach nur so hoch.
Um das etwas besser sichtbar zu machen eigenen sich z.B. Firebug für Firefox oder ähnliches für andere Browser.
~dave
@ Gunnar: Ich möchte nur einen Farbwechsel. Also ganz oben eine Farbe und ganz unten die andere. Dazwischen der Verlauf. Bei mir wird es aber die ganze Zeit wiederholt. Dieses Problem hab ich aber mit „background-attachment: fixed;“ lösen können. Keine Ahnung, ob es dafür gedacht ist, aber es funktioniert.
@bleicher: Genau sowas hab ich gesucht. Muss ich mal bei Gelegenheit ausprobieren. Danke
@Steel: Den Hintergrund der Tabelle hab ich bewusst anders gemacht. Die Tabelle ist vertikal und horizontal zentriert. Und alles was über und unter der Tabelle is, ist einfach nur weiß. Ich weiß nicht, wie ich es anders formulieren soll.
@dave:
„Dann ist das Element dem du den Hintergrund geben hast einfach nur so hoch.“
Bei anderen Browsern funktioniert es. Nur nicht bei Opera, weils nicht unterstützt wird und beim Internet Explorer. Beim IE wundert mich das, weil der IE das ja anscheinend unterstützt und anzeigt, nur nicht eben wie die anderen Browser, obwohl ich den Code von der Seite einfach nur eingefügt habe.
Danke für eure Hilfe.
Hora
@@horaman:
nuqneH
Bei mir wird es aber die ganze Zeit wiederholt.
Du meinst, ein Verlauf hat die Höhe des Viewports und wenn das Dokument länger ist, wiederholt sich der Verlauf (beim Scrollen)?
Dieses Problem hab ich aber mit „background-attachment: fixed;“ lösen können. Keine Ahnung, ob es dafür gedacht ist, aber es funktioniert.
Ja.
Qapla'
Bei mir wird es aber die ganze Zeit wiederholt.
Du meinst, ein Verlauf hat die Höhe des Viewports und wenn das Dokument länger ist, wiederholt sich der Verlauf (beim Scrollen)?
Ja, ich verkleiner die Bildansicht mit (STRG -) und dann sehe ich, dass es immer wieder wiederholt wird.
Hora
Moin!
Es wird kein Code angezeigt. Hab mich ein bischen falsch ausgedrückt. Ich habe meinen Hintergrund(Verlauf von grau zu schwarz) und eine kleine zentrierte Tabelle. Über und unter der Tabelle ist noch genügend Platz. Mein Hintergrund fängt aber erst da an, wo meine Tabelle anfängt und hört da auf, wo meine Tabelle aufhört. Man sieht also nur links und rechts neben der Tabelle meinen Hintergrund und oben und unten ist der Hintergrund weiß.
Dann hast Du den Hintergrund der Tabelle verpasst?
Ja: dann wunder dich nicht.
Nein: sondern?
@@horaman:
nuqneH
grau
(Verlauf)
schwarz
grau
(Verlauf)
schwarz
etc.
Auch das ist mit Gradienten möglich.
Was heißt „etc.“? Möchtest du eine feste Anzahl von Farbwechseln oder eine konstante Breite eines Farbwechsels wiederholen?
Qapla'
Hi,
danke dave, wie ich sehe, gibt es wohl keine andere Möglichkeit außer CSS3 zu benutzen.
Es gibt sicher andere Möglichkeiten, nur ist IMHO die von mir verlinkte die beste.
Ich hab noch folgenden Code hinzugefügt, damit sich das ganze auch vertikal streckt:
Du meinst das Verlauf mit CSS ging nicht über die gesamt Breite der Seite?
Welchem Element hast du den Verlauf gegeben und wie Breit ist das?
background-attachment: fixed;
Ich sehe nicht wie das das Problem löst, wundert mich dass es scheinbar funktioniert?
Irgendwie klappt das bei mir nicht mit dem Internet Explorer 8.0. Die Farbe wird zwar angezeigt, aber gestreckt wird es nur bis zum Ende der letzten Zeile vom Code.
Was wird gestreckt?
Auf deiner Seite ist Code sichtbar?
Ich verstehe nicht was du damit sagen willst...
Ein Onlinebeispiel oder auf dein Problem reduzierter Code wäre ganz nützlich.
~dave
Grüße,
suchst du DAS?
MFG
bleicher