mahiro
Hi,
ich will ne einfache Startseite machen und habe dies auch geschaft doch möchte ich jetzt unter das Bild was per DIV angezeigt werden noch Text haben in einem anderen DIV. Wie macht man das?
| code: |
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
|
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Alles hat einen Anfang...</title>
</head>
<body style="background-color:#000000;">
<div style="background-image: url('http://www.animesora.de/splash.gif'); background-repeat: no-repeat;background-postition:center;background-color:#000000;width:400px;height:400px;margin:auto;"></div>
</body>
</html> |
|
Konoha
Lern erst einmal richtig CSS, wird sehr unständlich alles so zu regeln.
Schweinebacke
| Zitat: |
Original von Konoha
Lern erst einmal richtig CSS, wird sehr unständlich alles so zu regeln. |
Na das ist doch mal ne Hilfe!
Zu deinem Problem:
Das Hintergrundbild hast du ja in die Mitte der Seite gebracht. Für das Bild allein auch kein Problem, nur wenn jetzt noch was zusätzliches rein kommt sollte der Browser natürlich wissen wie er damit umgehen soll.
Im Prinzip sind deine Angaben korrekt. Nur muss es noch positioniert werden, damit der Inhalt (Text) dann auch platziert werden kann.
Dem div gibst du die Position „relative“ mit. So bleibt das HG-Bild in der Mitte.
Jetzt kannst du in das div ein Element einsetzen, dass du neu positionieren kannst. Ich habe da ein Linien-Element (span) genommen.
Das wird jetzt mit einen Position „absolute“ eingesetzt. Damit das auch unten erscheint kommt „bottom:0px;“ hinzu. Den Text in die Mitte mit „text-align:center; padding:auto;“ und das es funktioniert muss eine Größe her „width:400px;“. Schwarze Schrift auf schwarzem Grund ist nicht so prickelnd, daher noch „color:#fff;“ für Weiß.
Fertig.
| code: |
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
|
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Alles hat einen Anfang...</title>
</head>
<body style="background-color:#000000;">
<div style="position:relative; width:400px; height:400px; background-image: url('http://www.animesora.de/splash.gif'); background-repeat: no-repeat; background-postition:center; background-color:#000000; margin:auto;"><span style="position:absolute; width:400px; bottom:0px; color:#fff; text-align:center; padding:auto;">Willkommen auf meine Page</span></div>
</body>
</html> |
|
mahiro
| Zitat: |
Original von Konoha
Lern erst einmal richtig CSS, wird sehr unständlich alles so zu regeln. |
Keine Lust zu zur Zeit!
Danke Schweinebacke für die Hilfe!