PDA

Archiv verlassen und diese Seite im Standarddesign anzeigen : Hintergrundbild zentrieren


suiheisen
17.04.2012, 21:03
Hallo, hab frisch mit html angefangen, deswegen diese Anfängerfrage. Ich benutze phase 5 als editor und ich möchte dass das Hintergrundbild als einzellnes in der Mitte zentriert ist. Also wenn ich das Bild anwähle als Hintergrund, dann ist es so gestreut, also es kommt mehrmals vor. Ich möchte aber dass es nur einmal vorkommt, genau in der Mitte. Habe im Internet schon ein bisschien rumgeschaut und versucht was dort gepostet wurde zu kopieren etc. aber ging irgendwie nie..

also momentan sieht die seite so aus:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>startbutton</title>
<meta name="author" content="admin">
<meta name="editor" content="html-editor phase 5">
</head>
<body text="#000000" bgcolor="#262626" link="#FF0000" alink="#FF0000" vlink="#FF0000">
<body background="Bilder/startbutton1.jpg"
</body>
</html>
sn0w
17.04.2012, 21:11
http://www.css4you.de/backgroundproperty.html

MfG
nelson1109
17.04.2012, 21:16
Dafür währe es nützlich die CSS Eigenschaften background-image, background-repeat und background-position zu kennen.
// Edit: Link zu der CSS "Klasse" Background hat Snow schon gepostet...

Mit deinem "Body" tag machst du einfach folgendes in CSS:
Bei background-image gibst du dein Bild an bei background-repeat sagst du das du keine wiederhohlungen (repeats) willst und bei background position sagst du das das bild in die mitte soll.
Ich glaube bei FF und Safari musst du auch noch background-attachment richtig angeben damit das geht...
// Edit: nicht safari sondern opera, und bg-attachment muss auf fixed (fixiert) gestellt sein
suiheisen
17.04.2012, 21:18
Aber wie genau hängt man das dann an? Hatte da schon ein paar Sachen probiert aber haben nie geklappt.
sn0w
17.04.2012, 21:21
http://de.html.net/tutorials/css/lesson1.php
http://de.html.net/tutorials/css/lesson3.php
suiheisen
17.04.2012, 21:54
Hab das nur zur Hälfte verstanden.. und so mal rein geschrieben aber nichtmal das klappt so oder was genau mache ich da falsch?


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>startbutton</title>
<meta name="author" content="admin">
<meta name="editor" content="html-editor phase 5">
</head>
<body text="#000000" bgcolor="#262626" link="#FF0000" alink="#FF0000" vlink="#FF0000">
<body {
background-image: url("C:\Program Files (x86)\phase5\Projekte\Tutorial\Bilder\startbutton1 .jpg");
}
</body>
</html>
nelson1109
17.04.2012, 22:06
Der zweite Bodytag (der übrigens nichtmal geschlossen wird) ist total falsch.
Die Style angaben müssen in einen eigenen tag. (style)

<style type="text/css">
body {
((image, attachment, position etc.))
}
</style>

Ansonsten kann man auch noch die Style sachen direkt in den Tag einbinden.

<body style="((img, attachment, position etc.))"></body>

Ausserdem kann man ein stylesheet auch extern einbinden...

Das kann man alles schön bei selfhtml nachlesen (schritt für schritt damit du das auch wirklich alles verstehst, wenn du bloß was einfügst wovon du keine ahnung hast ist das irgendwie sinnlos)
suiheisen
17.04.2012, 22:20
Ich will es auch verstehen aber es klappt ja nichtmal was ich hier eingebe, weder

<style type="text/css">
<body {
((background-image: url("C:\Program Files (x86)\phase5\Projekte\Tutorial\Bilder\startbutton1 .jpg"));
}
</style>
</body>noch

<body style="((background-image: url(C:\Program Files (x86)\phase5\Projekte\Tutorial\Bilder\startbutton1 .jpg))"></body>
sn0w
17.04.2012, 23:38
Lies dir die Tutorials durch und fertig. Da du hier keinerlei Initiative zeigst ist hier nun Schluß mit der Hilfe.