Alex: Hintergrund Frage

Hallo,

Mit:

background: #FFFFFF url('grafik.jpg') no-repeat

Stelle ich ein dass eine Grafik zuerst als Hintergrund ist und dann die Farbe weiß, ich möchte aber einstellen das eine Grafik zuerst kommt und sich dann eine Grafik stendigt wiederholt, geht das?

----------
Grafik 1
----------
Grafik 2
----------
Grafik 2
----------
Grafik 2
----------
Grafik 2
.
.
.

  1. Hi Alex,

    ich möchte aber einstellen das eine Grafik zuerst kommt und sich dann eine Grafik stendigt wiederholt, geht das?

    ja. Grafik 2 definierst du mit repeat-y als Hintergrund für html {} und Grafik 1 mit no-repeat für body {}.

    http://de.selfhtml.org/css/eigenschaften/hintergrund.htm#background_repeat

    Grüße,
     Roland

    1. Hallo,

      Da steig ich aus.... so gut kann ich css noch nicht, wie müsste das was auf dieser Seite steht in einer css Datei aussehen? So das ich nichts in der Html Datei stehen habe sondern alles in einer CSS Datei?

      1. Hi Alex,

        wie müsste das was auf dieser Seite steht in einer css Datei aussehen? So das ich nichts in der Html Datei stehen habe sondern alles in einer CSS Datei?

        html { background:#fff url("grafik2.png") repeat-y; }
         body { background:#fff url("grafik1.png") no-repeat; }

        Grüße,
         Roland

        1. Hallo,

          html { background:#fff url("grafik2.png") repeat-y; }
          body { background:#fff url("grafik1.png") no-repeat; }

          Kann man das <html>-Element mit einem Hintergrund hinterlegen? Denn AFAIK dient es doch zum logischen Zusammenhalt von (unsichtbarem) Head und (sichtbarem) Body der Seite.

          Gruß
          Arx

          Post Scriptum: BTW: Denkt noch irgendjemand an meine Frage [pref:t=82799&m=484143]?

          --
          ss:| zu:| ls:& fo:) de:] va:} ch:? n4:{ rl:? br:& js:| ie:% fl:| mo:}
          1. Hi Arx,

            Kann man das <html>-Element mit einem Hintergrund hinterlegen?

            Ja, denn

            http://www.w3.org/TR/CSS21/colors.html#propdef-background sagt:

            | Applies to: all elements

            Denn AFAIK dient es doch zum logischen Zusammenhalt von (unsichtbarem) Head und (sichtbarem) Body der Seite.

            Nicht wirklich. Gib <html> eine Hintergrundfarbe und einen ausreichend großen Innenabstand zu <body> und du wirst sehen, dass <body> auch nicht mehr als ein Kindelement von <html> ist. Operas "showstructure"-Stylesheet beispielsweise zeigt auch Element aus dem Seitenkopf sichtbar an, siehe

            http://orwell.ru/test/CSS/_cssopus?Showstructure

            Was "Inhalt" einer Seite ist, lässt sich somit nicht nur anhand der Elemente in <body> definieren.

            Grüße,
             Roland

            1. N'Obend

              Was "Inhalt" einer Seite ist, lässt sich somit nicht nur anhand der Elemente in <body> definieren.

              Nun, man lernt hier wirklich immer wieder was dazu, dank dir!

              Lustig auch, dass man mit CSS auch den head oder title anzeigen lassen kann.

              "title" konnte ich zwar hier nicht finden:
              http://www.w3.org/TR/CSS21/sample.html
              aber das will ja nichts heißen :)

              Firefox jedenfalls hat keine Probleme damit. Der IE lässt sich zwar mit dem richtigen Doctype noch überreden html als normales Element zu betrachten, den head konnte ich ihm aber noch nicht entlocken.

              http://home.arcor.de/dbenzhuser/daten/css-test.html

              Tschö,
              dbenzhuser

              1. Hi,

                http://home.arcor.de/dbenzhuser/daten/css-test.html

                Da fehlt - glaube ich - die CSS-Datei...

                Gruß
                Arx

                --
                Do it yourSELF 'cause SELFmade is bestmade.
                Selfcode: ie:% fl:( br:^ va:} ls:[ fo:) rl:( n4:{ ss:| de:> js:| ch:? mo:} zu:)
                Selfcode entschlüsseln: http://peter.in-berlin.de/projekte/selfcode/
                Selfcode-Info: http://emmanuel.dammerer.at/selfcode.html
                Für alle Forum-Neulinge:
                1.http://de.selfhtml.org/
                2.http://suche.de.selfhtml.org/ -> http://forum.de.selfhtml.org/archiv/
                3.http://forum.de.selfhtml.org/faq/ -> http://forum.de.selfhtml.org/cgi-bin/fo_post
                1. N'Obend

                  Da fehlt - glaube ich - die CSS-Datei...

                  Nein, da liegst du falsch, die Datei ist da, nur der Link drauf war falsch...

                  Tschö,
                  dbenzhuser

                  1. Hi,

                    Da fehlt - glaube ich - die CSS-Datei...
                    Nein, da liegst du falsch, die Datei ist da, nur der Link drauf war falsch...

                    Auch 'ne mögliche Fehlerquelle...;-)

                    Jedenfalls ist der Effekt, den man durch die Formatierung von <html>, <head> und <title> erzielen kann, irgendwie...<jugendsprache>geil</jugendsprache>...

                    Gruß
                    Arx

                    --
                    Do it yourSELF 'cause SELFmade is bestmade.
                    Selfcode: ie:% fl:( br:^ va:} ls:[ fo:) rl:( n4:{ ss:| de:> js:| ch:? mo:} zu:)
                    Selfcode entschlüsseln: http://peter.in-berlin.de/projekte/selfcode/
                    Selfcode-Info: http://emmanuel.dammerer.at/selfcode.html
                    Für alle Forum-Neulinge:
                    1.http://de.selfhtml.org/
                    2.http://suche.de.selfhtml.org/ -> http://forum.de.selfhtml.org/archiv/
                    3.http://forum.de.selfhtml.org/faq/ -> http://forum.de.selfhtml.org/cgi-bin/fo_post
    2. Hi Orlando,

      ja. Grafik 2 definierst du mit repeat-y als Hintergrund für html {} und Grafik 1 mit no-repeat für body {}.

      Toll, wusste gar nicht, dass das geht.

      Viele Grüße
      Mathias Bigge

      --
      http://aktuell.de.selfhtml.org/tippstricks/index.htm
      <img src="http://www.port-vision.de/augen.gif" border="0" alt="">
      1. hi,

        ja. Grafik 2 definierst du mit repeat-y als Hintergrund für html {} und Grafik 1 mit no-repeat für body {}.
        Toll, wusste gar nicht, dass das geht.

        und ich habe auch jetzt noch zweifel :-)

        ich hatte das auch schon mal ausprobiert, hat aber nicht wie gewünscht funktioniert, jedenfalls nicht browserübergreifend.

        es wurde immer nur eines der beiden hintergrundbilder angezeigt.

        gruß,
        wahsaga

        --
        [ Hier könnte Ihre Werbung stehen! ]
        1. hi,

          ich muss da noch mal drauf eingehen, weil ich es gerade auch ganz gut brauchen könnte ...

          ja. Grafik 2 definierst du mit repeat-y als Hintergrund für html {} und Grafik 1 mit no-repeat für body {}.

          ich hatte das auch schon mal ausprobiert, hat aber nicht wie gewünscht funktioniert, jedenfalls nicht browserübergreifend.
          es wurde immer nur eines der beiden hintergrundbilder angezeigt.

          ich habe das jetzt noch mal ausprobiert [1] ...

          opera 7.5 und IE 6 machen keine probleme, IE < 6 wollen es nicht mitmachen.
          und der firefox (0.8) zeigt zwar beide hintergrundbilder an - aber anschliessend geht die prozessorauslastung auf 100%, und der ganze rechner [2] reagiert nur noch mit extremer verzögerung auf jegliche eingaben (mehrere sekunden). sobald ich den firefox schliesse, geht's auch dem rechner wieder gut ...

          mich würde nun interessieren, ob jemand diese erfahrungen bestätigen kann - denn wenn das allgemein so ist, ist diese methode natürlich nur sehr eingeschränkt zu empfehlen.

          gruß,
          wahsaga

          [1] mein test-css in einer ansonsten bis auf den text "blah" im body leeren, validen seite:

          html { height:100%; background:url(hintergrundbild1.png) no-repeat top left; }
          body { height:100%; margin:0; padding:0; background:transparent url(hintergrundbild2.png) no-repeat bottom right; }

          bilder ca. 400*300 pixel groß, PNG mit 256 farben.

          [2] P3 mit 667MHz und 256MB RAM, Win XP - zwar nicht mehr wirklich state of the art, aber ansonsten eigentlich immer noch recht zuverlässig und zum arbeiten brauchbar.

          --
          [ Hier könnte Ihre Werbung stehen! ]
          1. Hi wahsaga,

            opera 7.5 und IE 6 machen keine probleme, IE < 6 wollen es nicht mitmachen.

            Korrekt.

            und der firefox (0.8) zeigt zwar beide hintergrundbilder an - aber anschliessend geht die prozessorauslastung auf 100%, und der ganze rechner [2] reagiert nur noch mit extremer verzögerung auf jegliche eingaben (mehrere sekunden). sobald ich den firefox schliesse, geht's auch dem rechner wieder gut ...

            Das kann ich mit Mozilla 1.6 bestätigen, in 1.7 gibt's das Problem allerdings nicht mehr.

            Grüße,
             Roland

            1. hi,

              Das kann ich mit Mozilla 1.6 bestätigen, in 1.7 gibt's das Problem allerdings nicht mehr.

              danke für die info.

              vielleicht sollte ich meinen feuerfuchs auch mal updaten - vielleicht aber auch nicht, weil man dann solche potentiellen probleme gar nicht mehr realisiert :-)

              da heißt es, für mich zumindest, wohl noch ein wenig abwarten, bis man das wirklich einsetzen kann :-/

              gruß,
              wahsaga

              --
              [ Hier könnte Ihre Werbung stehen! ]
  2. Hallo!

    background: #FFFFFF url('grafik.jpg') no-repeat

    Stelle ich ein dass eine Grafik zuerst als Hintergrund ist und dann die Farbe weiß, ich möchte aber einstellen das eine Grafik zuerst kommt und sich dann eine Grafik stendigt wiederholt, geht das?

    Also ich verstehe Deine Frage nicht. Kann es sein, daß die Verwendung zweier Angaben Dein Problem löst?
    background-image
    background-color

    Beste Grüße
    Viennamade

    1. Hi,

      Ich möchte einfach das der Hintergrund so aussieht:

      ----------------------------
      Hintergrund bild 1 (hg1.gif)
      ----------------------------
      Hintergrund bild 2 (hg2.gif)
      ----------------------------
      Hintergrund bild 2 (hg2.gif)
      ----------------------------
      Hintergrund bild 2 (hg2.gif)
      ----------------------------
      Hintergrund bild 2 (hg2.gif)
      ----------------------------
      Hintergrund bild 2 (hg2.gif)

      Und das mit CSS lösen, verstehst du jetzt was ich meine?

      1. Hallo!

        Ich möchte einfach das der Hintergrund so aussieht:
        Hintergrund bild 1 (hg1.gif)
        Hintergrund bild 2 (hg2.gif)
        Hintergrund bild 2 (hg2.gif)
        Hintergrund bild 2 (hg2.gif)

        ...

        Und das mit CSS lösen ...

        Viele Blockelemente können mit einem background-image versehen werden: p, div, table, tr, td ... aber nur mit _einem_.

        Wenn Du also mehrere background-images haben willst, dann brauchst Du mehrere HTML-Elemente.
        Habe ich Dich jetzt richtig verstanden?

        Beste Grüße
        Viennamade

        1. Hallo!

          Wenn Du also mehrere background-images haben willst, dann brauchst Du mehrere HTML-Elemente.

          Was ich vergessen habe: repeat, repeat-x, repeat-y, no-repeat gibts auch noch.

          Beste Grüße
          Viennamade

        2. Hi,

          Viele Blockelemente können mit einem background-image versehen werden: p, div, table, tr, td ... aber nur mit _einem_.

          background-image unterliegt keinerlei Beschränkung, was die Elemente betrifft, auf die es angewendet werden kann.
          background-image erlaubt, wie Du richtig erkannt hast, die Angabe von genau einem Hintergrundbild.

          cu,
          Andreas

          --
          MudGuard? Siehe http://www.Mud-Guard.de/
          Fachfragen per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.
        3. Hi,

          Viele Blockelemente können mit einem background-image versehen werden: p, div, table, tr, td ... aber nur mit _einem_.

          Vergessen: tr und td sind keine block-Elemente.

          cu,
          Andreas

          --
          MudGuard? Siehe http://www.Mud-Guard.de/
          Fachfragen per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.
          1. Hallo!

            Vergessen: tr und td sind keine block-Elemente.

            Alles klar & Danke!
            Viennamade