Hallo !
Bin neu hier und habe eine Frage und die Hoffnung auf eine Antwort.
Ich möchte eine eigene Webseite erstellen.
Ich habe eine konkrete Vorstellung und habe damit allerdings ein Problem.
Folgendes ist wichtig bevor ich meine Webseite mit durchsichtigen Divs ... welche gefülllt mit Texten sein sollen ... bestücke.
Ich möchte ein Hintergrundbild haben.
Das ist grundsätzlich auch erstmal kein Problem.
Allerdings habe ich genaue Vorstellungen und kann diese nicht realisieren.
Es soll sich folgendermassen verhalten:
Es soll zentriert dargestellt werden.
Es soll das Seitenverhältnis behalten.
Sprich wenn man das Browserfenster verschiebt soll es nicht verzerren und immer seine Form behalten.
Wenn man das Browserfenster in der Breite schmaler schiebt soll es kleiner werden aber ab einem bestimmten Punkt sollen die Seiten des Bildes rechts und links aus dem Browserfenster sozusagen rausfahren.
Das gilt auch für das Verhalten des Hintergrundbildes in der Höhe wenn das Browserfenster verkleinert wird.
Es sollen keine Ränder oder ähnliches da sein rings um das Hintergrundbild.
Es soll also so aussehen als wenn das Browserfenster ein Bild darstellt im Hintergrund.
Macht man das Fenster des Browsers kleiner auf dem Desktop soll das Aspect Ratio gleich bleiben und das Bild etwas kleiner werden bis zu einem bestimmten Punkt und dann teilweise links und rechts und oben und unten aus dem Browserfenster verschwinden.
Zumindest soll es so wirken.
Wie kann ich das mit welchen Quellcode anstellen???
Ich hoffe das mir jemand ein Beispiel hier postet.
Meine HTML-Seite sieht bisher blank aus ... nämlich folgendermassen:
<!DOCTYPE html>
<html>
<head>
<title>Webseite Hintergrundbild</title>
<meta charset="ISO-8859-1">
<meta name="description" content="">
<meta name="author" content="">
<meta name="keywords" content="">
<meta name="generator" content="Webocton - Scriptly ([url]www.scriptly.de[/url])">
<link href="style.css" type="text/css" rel="stylesheet">
</head>
<body>
</body>
</html>
Alles anzeigen
Die CSS-Datei sieht so aus :
Also wie man sieht bin ich am Anfang der Arbeit.
Ich habe schon Ideen die ich auch realisieren könnte dank der Tutorials auf der HTML-Seminar-de-Seite.
Aber dort finde ich bisher keine Hilfe bezüglich des Webseiten-Hintergrundes.
Zumindest keine die das ermöglicht was ich mir vorstelle.
Nur ein Beispiel ist dort zu sehen welches meinen Vorstellungen optisch nahekommt.
Da ist es aber so das sich das Hintergrundbild immer verzerrt und das Aspect Ratio verliert wenn man das Browserfenster verkleinert.
Hier der Link:
http://www.html-seminar.de/bei…intergrund_aufspannen.htm
Ich möchte aber das es zwar grundsätzlich so aussieht aber das Aspect Ratio behält und beim verkleinern des Browserfensters kleiner wird und irgendwann unten und seitlich rausfährt so dass es immer mittig dargestellt wird auch im verkleinertwen Browserfenster auf dem Desktop.
Ich hoffe es ist aus meiner Erklärung klar geworden was ich meine.
Ich hoffe auf baldige Antwort.
Vor allem auf eine einfache Antwort.
Mir wäre ein Post recht der den oben gelisteten Quellcode erweitert mit den nötigen Ergänzungen.
Das Bild das im Hintergrund eingefügt werden soll trägt den Titel "website_background.jpg".
Es ist von den Maßen her 1920x1080 wenn das wichtig sein sollte.
Die Webseite soll auch optimiert werden für 1920x1080 er Auflösung.
Dennoch sollte man das Browserfenster verkleinern können in der Auflösung ohne das mein Hintergrundbild verzerrt oder nicht mehr korrekt sichtbar dargestellt wird.
Wenn das Problem gelöst ist und ich das habe was ich mir vorstelle kann ich endlich anfangen.
Der Rest der mir so vorschwebt sollte alleine schaffbar sein.
Die Tutorials sind sehr gut hier auf HTML-Seminar.de.
Aber bevor ich das Hintergrundbild nicht realisiert habe macht es einfach keinen Spass weiterzumachen.
Wenn es zu Beginn schon hapert am Hintergrundbild ist das echt frusstrierend.
Ich bin dankbar für jeden helfenden Post.
Am liebsten mit ergänzten Quellcode.
Gruss Rongkongcoma