Tobias: Hintergrund

Hallo,

folgende frage: ich möchte einen Hintergrund erstellen welcher nur ein Rotes Kreuz auf weißen hintergrund darstellt. Es ist je sehr verpöhnt dieses mit Tabellen oder frames zu erstellen da diese nicht zum Graphischengestalltung genutzt werden sollen.

Gibt es noch eine andere Möglichkeit außer ein großes Hintergrundbild zu nehmen?
Möchte das sich das Kreuz dynamisch an die fenstergröße anpaßt.

Danke für Eure Tipps.

Gruß Tobias

  1. Hallo Tobias.

    folgende frage: ich möchte einen Hintergrund erstellen welcher nur ein Rotes Kreuz auf weißen hintergrund darstellt.

    Dann tue dies.

    Es ist je sehr verpöhnt dieses mit Tabellen oder frames zu erstellen da diese nicht zum Graphischengestalltung genutzt werden sollen.

    Schon gar nicht für eine solche Kleinigkeit.

    Gibt es noch eine andere Möglichkeit außer ein großes Hintergrundbild zu nehmen?

    Nimm ein kleines Bild mit minimaler Größe und lege seine http://de.selfhtml.org/css/eigenschaften/hintergrund.htm#background_position@title=Position nach deinen Bedürfnissen fest.

    Möchte das sich das Kreuz dynamisch an die fenstergröße anpaßt.

    Das bedeuted ..?

    Einen schönen Donnerstag noch.

    Gruß, Ashura

    1. Hallo Tobias.

      folgende frage: ich möchte einen Hintergrund erstellen welcher nur ein Rotes Kreuz auf weißen hintergrund darstellt.

      Dann tue dies.

      Es ist je sehr verpöhnt dieses mit Tabellen oder frames zu erstellen da diese nicht zum Graphischengestalltung genutzt werden sollen.

      Schon gar nicht für eine solche Kleinigkeit.

      Gibt es noch eine andere Möglichkeit außer ein großes Hintergrundbild zu nehmen?

      Nimm ein kleines Bild mit minimaler Größe und lege seine http://de.selfhtml.org/css/eigenschaften/hintergrund.htm#background_position@title=Position nach deinen Bedürfnissen fest.

      Wie strecke ich dann dieses kleine Bild? und werden die Farben bzw kanten dann auch scharf dargestellt?

      Möchte das sich das Kreuz dynamisch an die fenstergröße anpaßt.

      Das bedeuted ..?

      Das dich der hintergrund dem Fenster anpassen soll. Möchte keine Scrollleisten an der seite haben.

      Derweiteren soll der Text ja innerhalb des kreuzes bleiben und soll nicht verschoben werden.

      Was hättst Du davon eine Tabelle zu erstellen und nur  die innengitternetzlinien Farbig zu gestalten?

      Einen schönen Donnerstag noch.

      Gruß, Ashura

      1. Hallo Tobias.

        Wie strecke ich dann dieses kleine Bild? und werden die Farben bzw kanten dann auch scharf dargestellt?

        Möglichst mit deinem Grafikprogramm.
        Browser sind grundsätzlich eher mangelhaft in der Lage, Grafiken zu skalieren.
        Grafiken mit HTML+CSS zu skalieren ist nur mit einigen kleinen Tricksereien möglich und das Resultat ist weit von dem entfernt, was man als ansehnlich bezeichnen würde.

        Derweiteren soll der Text ja innerhalb des kreuzes bleiben und soll nicht verschoben werden.

        Wenn du für die Ausrichtung des Textes ein und die selben Werte verwendest, wie für die Hintergrundposition, sollte dahingehend kaum ein Problem bestehen.
        Um absolute Positionierung solltest du hierbei besser einen großen Bogen machen, da der Nutzen verhältnismäßig gering ausfällt.

        Was hättst Du davon eine Tabelle zu erstellen und nur  die innengitternetzlinien Farbig zu gestalten?

        Abstand.

        Einen schönen Donnerstag noch.

        Gruß, Ashura

        1. Browser sind grundsätzlich eher mangelhaft in der Lage, Grafiken zu skalieren.
          Grafiken mit HTML+CSS zu skalieren ist nur mit einigen kleinen Tricksereien möglich und das Resultat ist weit von dem entfernt, was man als ansehnlich bezeichnen würde.

          Ashura,
          Das ist prinzipiell richtig. Aber bei ausschließlich horizontalen und vertikalen Kanten hier völlig irrelevant.

          Live long and prosper,
          Gunnar

          --
          „Weisheit ist nicht das Ergebnis der Schulbildung, sondern des lebenslangen Versuchs, sie zu erwerben.“ (Albert Einstein)
      2. Derweiteren soll der Text ja innerhalb des kreuzes bleiben und soll nicht verschoben werden.

        Hehe, ein Browser ist kein DTP-Programm!

        <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">  
        <html xmlns="http://www.w3.org/1999/xhtml">  
          <head>  
            <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />  
            <title>Lorem ipsum</title>  
            <style type="text/css">  
              [code lang=css]#oben, #mitte, #unten {  
                display: block;  
                margin: auto;  
                text-align: center;  /* wenn gewünscht */  
                background: red;  /* wenn das Kreuz nicht ausgefüllt sein soll: border-* */  
              }  
              #oben, #unten {  
                width: 8em;  
              }  
              #mitte {  
                width: 16em;  
              }  
              * body {  
                text-align: center;  /* IE hack */  
              }
        

        </style>
          </head>
          <body>
            <span id="oben">Lorem ipsum dolor sit amet, consetetur sadipscing elitr,</span>
            <span id="mitte">sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea</span>
            <span id="unten">rebum. Stet clita kasd gubergren, no sea takimata sanctus est.</span>
          </body>
        </html>[/code]

        Live long and prosper,
        Gunnar

        --
        „Weisheit ist nicht das Ergebnis der Schulbildung, sondern des lebenslangen Versuchs, sie zu erwerben.“ (Albert Einstein)
        1. Hallo Gunnar,

          • body {

          text-align: center;  /* IE hack */
          }

          Du meinst "\* html {...", oder?  
            
          Grüße aus Nürnberg  
          Tobias
          
          -- 
          TOP7: [Hinweise, dass ein Mitglied deiner WG ein Psychopath ist](http://www.familie-ahlers.de/top7/index.php?liste=356) ([blutige Version](http://www.familie-ahlers.de/top7/index.php?liste=355))  
          Softwaretipp: [TV-Browser](http://www.tvbrowser.org/)
          
          1. Du meinst "* html {...", oder?

            Tobias,
            Eigentlich "* html body {..." :-)

            Live long and prosper,
            Gunnar

            --
            „Weisheit ist nicht das Ergebnis der Schulbildung, sondern des lebenslangen Versuchs, sie zu erwerben.“ (Albert Einstein)
        2. Das mit dem Kreuz  ist schon nicht schlecht aber ich habe mich evt. Falsch ausgedrückt.

          Ich habe schon einige versuche unternommen um ein Rotes Kreuz zu erstellen was s aussehen sollte:

          http://www.dertobman.de/versuche/versuch1.htm

          Dieses ist mit Frame geschehen wo ich auch gleich was im Forum auf die Mütze bekommen da man so was auf keinen Fall machen sollte.

          Ich möchte auch nicht Text/Links/ Grafiken im roten bereich sondern im Weißen bereich erstellen.

          Danke im Voraus für deine Hilfe.

          Gruß Tobias

          1. Hallo Tobias.

            http://www.dertobman.de/versuche/versuch1.htm

            Ich möchte auch nicht Text/Links/ Grafiken im roten bereich sondern im Weißen bereich erstellen.

            Dieses Konstrukt könntest du optisch relativ leicht mit CSS und einer Grafik bewerkstelligen.

            Dem body-Element verpasst du den senkrechten Strich als http://de.selfhtml.org/css/eigenschaften/hintergrund.htm#background_image@title=Hintergrundgrafik mit der von gewünschten http://de.selfhtml.org/css/eigenschaften/hintergrund.htm#background_position@title=Position.
            (Die Grafik könnte beispielsweise sogar lediglich eine Höhe von 1 Pixel und deine gewünschten Breite haben; diese brauchst du dann lediglich in y-Richtung http://de.selfhtml.org/css/eigenschaften/hintergrund.htm#background_repeat@title=wiederholen zu lassen.)
            Dann fügst du hier noch ein gruppierendes Header-Element und ein Inhalts-Element hinzu. Einem von diesen beiden verpasst du eine ebenso breite http://de.selfhtml.org/css/eigenschaften/rahmen.htm#border@title=Rahmenlinie oben bzw. unten wie in deiner Grafik. (Hier bietet sich sicher px als Einheit an.)
            Willst du nun noch bewerkstelligen, dass eingefügter Text an der Linie beginnt, vergibst du ein passendes http://de.selfhtml.org/css/eigenschaften/innenabstand.htm#padding_left@title=padding-left.

            Einen schönen Samstag noch.

            Gruß, Ashura

  2. Möchte das sich das Kreuz dynamisch an die fenstergröße anpaßt.

    Tobias,
    siehe [http://forum.de.selfhtml.org/my/?t=117978&m=756129].

    Live long and prosper,
    Gunnar

    --
    „Weisheit ist nicht das Ergebnis der Schulbildung, sondern des lebenslangen Versuchs, sie zu erwerben.“ (Albert Einstein)