Bild zentrieren
lima-city: free Hosting → Forum → Die eigene Homepage → HTML, CSS & Javascript
auflösung
aufwand
auto
background
bild
center
composer
denke mal
eben
editor
größe
hintergrund
hintergrundbild
klasse
kleinerer bildschirm
margin
mitte
möglichkeit
tabelle
transitional
-
Hey Leute,
ich hab ein kleines Problem wie kriege ich dieses Bild (lassidaassi.lima-city.de) in die Mitte der Seite ohne es zu verkleinern.
Also es sollte eben auf beiden Seiten abgeschnitten sein wenn es ein kleinerer Bildschirm ist.
... -
lassidaassi schrieb:
Hey Leute,
ich hab ein kleines Problem wie kriege ich dieses Bild (lassidaassi.lima-city.de) in die Mitte der Seite ohne es zu verkleinern.
Also es sollte eben auf beiden Seiten abgeschnitten sein wenn es ein kleinerer Bildschirm ist.
...
Könntest du dich bitte etwas präzoeser audrücken.
Was meinst du mit zentriren? Horizontal oder Vertikal?
Also bei mir ist es nähmlich zentreirt (Horizontal).
Beitrag zuletzt geändert: 20.3.2010 17:23:49 von no-smoke -
-
sagt dir css etwas?...
soll es mitten im text oder im hintergrund sein?
mit css einbinden und die größe in % angeben, lage - mitte, dann verschmälert es sich zur mitte hin -
also es soll als hintergrundbild horizontal zentriert sein damit es links und rechts abgeschnitten ist.
-
Mit HTML einfach vor und nach dem <img> einfach <center> setzen und das auch schließen. In CSS könnte man das jetzt auch mit einer Klasse definieren, aber ich denke mal der Aufwand und der Umfang sind ausschlaggebend.
EDIT: Hab mich verlesen eben. Also man könnte das mit der <div> Klasse erledigen. Man kann diese so wie Ebene einordnen und daher musst du dann kein Hintergrundbild definieren. So besteht auch die Möglichkeit, das man einen Hintergrund dynamisch an jede Auflösung anpassen kann. Belese dich einfach mal zu dem <div> Befehl.
EDIT2: Bei deiner Seite könnte man aber auch eine Tabelle verwenden, die mit einem Hintergrundbild belegt wird. Du musst die Größe deiner Grafik in die Tabelle übertragen. Tabelle zentrieren versteht sich von selber.
Mit freundlichen Grüßen
Wolf
Beitrag zuletzt geändert: 20.3.2010 17:39:17 von lostwolf -
du musst nur deine "style.css" etwas ändern.
Hier beide codes zur sicherheit...
HTML
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta content="text/html; charset=ISO-8859-1"
http-equiv="content-type">
<title>test</title>
<link rel="stylesheet" type="text/css"
href="style.css">
</head>
<body
style="color: rgb(0, 0, 0); background-color: rgb(255, 255, 255);"
alink="#000088" link="#ffffff" vlink="#ff0000">
<div align="center">
<div class="header"> </div>
</div>
</body>
</html>
style.css
/* Generated by CaScadeS, a stylesheet editor for Mozilla Composer */
body { margin: 0px;
padding: 0px;
}
.header { margin: 0pt auto;
height: 388px;
background-image: url(http://lassidaassi.lima-city.de/img/header.jpg);
text-align: center;
background-position: center;
width: 100%;
}
-
.header { height: 388px; background: url(img/header.jpg) no-repeat center top; text-align:center; margin: 0 auto; }
Sollte reichen Deine CSS zu ändern... einfach die Änderung bei background ergänzen!
Beitrag zuletzt geändert: 20.3.2010 18:03:44 von staymyfriend -
Danke an alle!
Tut mir Leid ich hab gar nicht an "background-position" gedacht :D
Dir gefällt dieses Thema?
Eigene günstige Domain gefällig?
Login
Domain-Aktion: 20 %!
15:57, 9.2.2012
Die Aktion läuft nur noch bis zum 15. Februar! Wir reduzieren die Preise für Domains, die du mit einer Laufzeit von mindestens 3 Jahren bestellst (oder verlängerst), um 20 %.
