Tutorialwelt.de » Farbverlauf Webseite http://www.tutorialwelt.de Tutorials aus der IT-Welt Sat, 22 May 2010 13:24:43 +0000 http://wordpress.org/?v=2.8.6 en hourly 1 Webdesign Tutorial – Farbverlauf für den Hintergrund einer Webseite erstellen http://www.tutorialwelt.de/509/webdesign-tutorial-farbverlauf-fur-den-hintergrund-einer-webseite-erstellen.htm http://www.tutorialwelt.de/509/webdesign-tutorial-farbverlauf-fur-den-hintergrund-einer-webseite-erstellen.htm#comments Mon, 25 Jan 2010 07:22:39 +0000 admin http://www.tutorialwelt.de/?p=509
  • CSS Tutorial mit Video – Hintergrund für Internet Seite erstellen Um einen Hintergrund für eine Webseite zu erstellen kann man...
  • Webdesign – Karierte Hintergründe für Ihre Webseite Heute möchte ich eine weitere Webseite vorstellen, mit der man...
  • Webdesign – Hintergrundmuster für Ihre Webseite (Retro Look) Heute möchte ich Ihnen eine weitere Webseite vorstellen, auf der...
    • Ähnliche Artikel bereitgestellt von Yet Another Related Posts Plugin.]]>     Webdesign Tutorial – Mit gradient-maker.com einen Farbverlauf für den Hintergrund einer Webseite erstellen

    Es gibt verschiedene Möglichkeiten einen Farbverlauf für den Hintergrund seiner Webseite zu erstellen.
    Man kann Photoshop oder GIMP als Software verwenden. Man erstellt ein neues Dokument mit der
    gewünschten Höhe und einer Breite von nur einem Pixel und wendet dort das Farbverlaufswerkzeug an.

    Man kann aber auch den kostenlosen Dienst einer Webseite in Anspruch nehmen.

    Auf gradient-maker.com können Sie ganz einfach einen Farbverlauf für Ihre Webseite erstellen.

    Stellen Sie einfach die Höhe ein die Startfarbe und die Endfarbe. Notieren Sie sich den Wert der Endfarbe. Diesen Wert benötigen wir dann noch für unseren CSS Code.

    Diesen Farbverlauf können wir ganz einfach mit folgendem CSS-Code in den Hintergrund unserer Seite integrieren:

    Beispielcode HTML:

    <html>
 <head>
  <style type="text/css">
   body {
                 background: #ffffff url('derdateiname.jpg') repeat-x;
   }
  </style>
 </head>
 <body>
 </body>
</html>



    Beachten Sie bitte, daß #ffffff der Farbwert für den unteren Wert des Farbverlaufes sein sollte.
    Das hat folgenden Grund: Man kann einen Hintergrund leider nicht beliebig strecken.
    Beim Erstellen des Hintergrundes legen wir bereits fest, wie hoch der Farbverlauf sein wird.
    Eine 400px hohe Farbverlaufsgrafik wird auch nur 400px des Hintergrundes an Höhe abdecken.
    Da wir dann einen schönen Übergang zu der eigentlichen Hintergrundfarbe wünschen, sollte der Hintergrund mit der unteren Farbe des Verlaufes flächendeckend gefüllt werden.

    In der Breite fordern wir den Browser auf, den Farbverlauf zu wiederholen. Das machen wir mit dem Zusatz repeat-x. X steht hierbei für die X-Achse eines Koordiantensystemes… also einer waagerechten Linie.

    In einem anderen Tutorial werde ich nochmals genauer auf das Erstellen von Hintergründen per CSS eingehen.

    Related posts:

    1. CSS Tutorial mit Video – Hintergrund für Internet Seite erstellen Um einen Hintergrund für eine Webseite zu erstellen kann man...
    2. Webdesign – Karierte Hintergründe für Ihre Webseite Heute möchte ich eine weitere Webseite vorstellen, mit der man...
    3. Webdesign – Hintergrundmuster für Ihre Webseite (Retro Look) Heute möchte ich Ihnen eine weitere Webseite vorstellen, auf der...

    Ähnliche Artikel bereitgestellt von Yet Another Related Posts Plugin.

    ]]>     http://www.tutorialwelt.de/509/webdesign-tutorial-farbverlauf-fur-den-hintergrund-einer-webseite-erstellen.htm/feed 0