Wie erstelle ich Html- Scroll-Boxen auf unterschiedlichen Hintergrundbildern?

2 Antworten

Lösungsmöglichkeiten:

a) Du nutzt einen ID-Selektor, um das Bild zu bestimmen:

<div class="img" id="picture-one">
#picture-one { background-image: url('picture1.jpg'); }

b) Du nutzt einen weiteren Klassenselektor:

<div class="img picture-one">
.picture-one { background-image: url('picture1.jpg'); }

In beiden Fällen lässt du das background-image-Property aus der img-Klasse natürlich weg.

Der Unterschied zwischen den vorgestellten Optionen liegt darin, dass du eine ID nur einmal für ein bestimmtes Element verwenden darfst. Solltest du dagegen für den Fall gewappnet sein wollen, ein Bild X mehreren Elementen zuordnen zu wollen, geht das nur mit einer Klasse.

1

Ok ich glaube grob zu verstehen worum es geht, aber ich bin wie gesagt absolut Programmier-unwissend. Ich kann mir lediglich durch simples Übersetzen denken dass beispielsweise height, width etc die Größe bestimmt und so weiter... Das hat ganz gut geklappt um den vorhandenen Code einfach für das was ich brauche anzupassen. Das wars dann leider aber auch schon.

Um ehrlich zu sein habe ich keine Ahnung wo die genannten Codes letztendlich dann hin müssen :(

So weit ich es verstehe dürfte aber auf jeden Fall Variante a ausreichen, da ich lediglich 3 Textboxen mit jeweils unterschiedlichem Bild erstellen möchte.

0
44
@GartenzwergLyra

Die jeweils 1. Code-Zeile ersetzt das 1. div, die jeweils 2. Code-Zeile muss innerhalb des style-Tags stehen. Ich beziehe mich dabei auf die Lösung, die in deinem Link gepostet wurde.

Generelles Grundwissen über HTML und CSS musst du dir selbst aneignen, wenn du selbst damit arbeiten möchtest. 

0

Das liegt daran, dass du Klassen nutzt. Wenn du verschiedene Elemente haben willst, könntest du IDs verwenden.

Wie läuft das abb?

Hallo,

Ich hätte mal eine Frage zum Webdesign da ich einwenig die Funktion dahinter verstehen möchte,

Ich verstehe nichts von HTML und sontigen programmier Kram, doch da ich mich mit Photoshop gut- und mit illustrator einwenig auskenne, wäre es kein Problem eine Website rein auf Design basierend zu erstellen (d.h. als Foto ohne Funktion).

Doch wie verläuft es dann weiter? Arbeitet dann anschließen ein Programmierer mit meiner Vorlage weiter und setzt Funktionen usw. ein? Oder nutzt man die oben von mit genannten Programme garnicht erst als Webdesigner?

...zur Frage

Optimizepress HTML Code Einfügen?

Ich Möchte einen HTML Code bei Optimizepress einfügen und kann meine Email nicht auswählen sie Bild hat einer ne Lösung vielleicht ?

...zur Frage

HTML / CSS scroll animation aber wie?

Hi, ich brauch eine Animation bei der man scrollt und ein div beginnt zu wachsen/zoomen nach einem Maximum soll es wieder kleiner werden und der nächste block wachsen usw. eine Grafik ist im Anhang. Ich brauch keinen fertigen Code eher einen Ansatz oder etwas vergleichbares.

...zur Frage

HTML-Code für einen aktuellen Sternenhimmel?

Ich suche einen HTML-Code, mit der mir ein aktuelles Bild vom Sternenhimmel zeigt.

Danke

...zur Frage

Ich möchte ein div mit Bild in einem div zentrieren?

Das hier ist der Code in CSS:

Das ist der Code in HTML:

Nun die Frage: Wie schaffe ich es, das Bild zentriert anzeigen zulassen? Und nein das Bild in einen <img> Tag zu packen würde bei meiner Seite zu einem Problem führen. Ich danke euch :)

...zur Frage

HTML Hintergrund zu klein?

Hallo zusammen, ich habe mir jetzt eine HTML Seite gemacht, aber irgendwie klappt das mit dem hintergrund nicht ganz. Der Hintergrund ist irgendwie zu klein. Also ich habe eine Farbe, kein Bild als background angegeben. Im Bield sieht man, was ich meine. Bitte helft mir. Ich bin verzweifelt. Bei dem transparenten steht ein Text. Auch in der schwarzen Box. Mein Body Code sieht wie folgt aus.

    html {
    background-color: beige
}

body {
    font-size: 16px;
    line-height: 1.5;
    margin: 0 auto;
    max-width: 1000;
    padding: 2em 2em 4em;
    margin-bottom: auto
}

body {
    background-color: aliceblue
}

LG Michael

...zur Frage

Was möchtest Du wissen?