Hintergrundbild fixieren und "einmalig" machen

    Hallo.

    Ich habe da ein großes Problem:

    ich habe ein Bild als Hintergrund auf meiner welcome.html. Es ist ein png.

    Ich wollte über eine CSS.Datei die Funktion erstellen, dass das Bild nicht nur fixiert wird, sondern sich auch nicht nach rechts oder nach unten weiter wiederholt.

    Allerdings funktionieren die Befehle nur bedingt, was heißen mag, das Fixieren funktioniert noch, indem man es bei "welcome.html" mit bgproperties="fixed" erledigt, doch die Wiederholung bleibt.


    Was habe ich in der CSS geschrieben: die CSS.Datei heißt bei mir style.css.


    div#box {

    background-image: url(bild-off-hell.png);

    background-size: contain;

    }


    Ich muss aber noch eins erwähnen: ich habe ein Frameseite aufgebaut, aus zwei Frames, oben und unten. Der obere Frame heißt "oben.html" und der unter "welcome.html". Beide sind unter "Index.html" gespeichert.

    Ich weiß nicht, ob das vl. die Frames der Auslöser sind, dass CSS nicht geht. Über SAFARI arbeite ich. Hängt das vl. vom Browser ab?


    lg, Jenny:)

    Hey Jenny,


    wie meinst du „beide sind unter Index.html gespeichert“?

    Du hast ja oben.html & welcome.html. Bindest du diese in die Index.html ein? Wenn ja wie?


    Ich brauche da genauere Infos wie du es machst.


    Das wiederholen des Bildes kannst du mit background-repeat: no-repeat; stoppen. Dieses musst du dann auf das Bild anwenden.


    Wenn du die welcome.html & oben.html in die Index.html einbinden möchtest empfehle ich dir die index.html zu einer Index.php zu ändern und diese beiden HTML-Dateien dann einfach einzubinden.


    schöne Grüße,

    Stef

    Hey, Stef.:)

    Also es ist so:

    ich habe zuerst eine "Index.html" erstellt:


    Danach die zwei "Htmls" "oben.html" und "welcome.html", die mit der "Index.html" verbunden sind. Die "welcome.html" beinhaltet das Hintergrundbild.

    Hier die "welcome.html":

    Ich habe das mit dem "background-repeat: no-repeat" bei der CSS.Datei eingegeben, aber es ändert sich nichts. Siehe selbst:

    CSS
    div#box {
    background-image: url(bild-off-hell.png);
    background-repeat: no-repeat;
}


    Meine Frage: warum soll "Index.html" in eine "Index.php" gemacht werden?

    Und geht das Erstellen einer PHP.Datei ganz einfach, dh. dass man beim Abspeichern den Namen "Index" wie gehabt eingibt, und bei der Endung dazu gefügt ".php"?



    glg, Jenny :)

    Wo auch immer du Frames aufgelesen hast, vergiss das Thema am Besten so schnell wie möglich wieder. Das ist Technik aus dem letzten Jahrtausend und gehört in die Mülltonne der Internetgeschichte. :)


    Code
    <body background="bild-off-hell.png" bgproperties="fixed" background-cover="size">

    Auch das ist veraltet und nicht mehr im HTML5-Standard enthalten. Verwende ausschliesslich CSS.


    Code
    div#box {

background-image: url(bild-off-hell.png);

background-repeat: no-repeat;
}

    Diese CSS-Angaben werden auf ein <div> Element mit der id="box" angewendet. So ein Element hast du nicht.


    Wenn du Dich mit Webdesign beschäfitgen willst solltest du Dich mit den Entwicklertools des Browser bekannt machen. Dort kannst du sehr genau nachvollziehen wo Dein CSS greift und wo nicht. Das ist ziemlich elementar.


    Für Safari:

    Zur Aktivierung: https://support.apple.com/de-ch/guide/safari/sfri20948/mac

    Handbuch: https://support.apple.com/de-c…ari-developer/welcome/mac

    Ich weiß, dass das ganze, was ich da beschrieben habe, veraltet ist, aber mit dem habe ich mich früher gern beschäftigt. Mit dem neueren Dingen habe ich mich so ziemlich gar nicht mehr beschäftigt.

    Danke für die Tipps bei Safari, ist leider aber, was ich so durchgeschaut habe auf den ersten Blick alles auf Englisch, ich schaue's aber trotzdem mal durch.


    Mir geht es ja nur darum, eine private, offline Seite mit Wörtern und Ideen zu erstellen, wo ich dann nach und nach welche hinzufügen kann bzw. suchen. Mehr verlange ich auch nicht. Gibt es da nicht irgendeine schnellere Hilfe?


    lg, Jenny

    Hey Jenny,


    da stimme ich Jonas eindeutig zu.


    Das ist veraltet und sollte so nicht genutzt werden.


    Du kannst diese Konstelation ganz einfach in aktuellem HTML & PHP-Einbindungen erstellen.
    Du brauchst einfach die index.html in eine index.php umändern. In dieser kannst du auch deinen normalen HTML-Code einfügen.


    Um die welcome & oben.html einbinden zu können musst du dann folgenden Code für beide Einbindungen erstellen:


    Mit require bindest du dann die HTML-Datei ein, wenn du diese Trennung weiterhin haben möchtest.


    PS: Kannst du bitte zukünftig deinen Code in die entsprechenden CodeTags (</>), in der Navigation des Editors, einfügen, damit dieser für uns leserlicher ist. Danke!


    Schöne Grüße,
    Stef

    Hallo, danke für die Info. Werd ich berücksichtigen mit dem Editor.


    Das Umändern von HTML zu PHP war zwar erfolgreich, jedoch lässt sich die PHP.Datei im Safari nicht öffnen, wenn ich draufklicke, sondern ich werde beim Draufklicken sofort zu meinem Editor zurückbeordert, wo ich wieder den Quellcode der PHP-Datei anschauen kann. :(


    Ich glaube, da werde ich vl. eine Art Programm oder so brauchen, damit die PHP-Datei als Seite geöffnet wird oder?

    Um PHP ausführen zu können, brauchst du einen Webserver mit PHP.


    Und statt require solltest du besser readfile benutzen, wenn es sich um eine reine HTML-Seite handelt, die eingebunden werden soll.

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!

Benutzerkonto erstellen Anmelden