webentwicklung-frage-antwort-db.com.de

So zentrieren Sie Bilder auf einer Webseite für alle Bildschirmgrößen

Ich habe ein Problem mit meinem HTML. Ich habe im ganzen Internet gesucht, aber immer noch keine richtige Antwort.

Ich habe eine Website mit einigen Bildern, und ich möchte, dass sie in der Mitte sind. Jetzt sind sie auf meinem Bildschirm in der Mitte, aber das liegt daran, dass ich sie dort platziert habe, indem ich sie zur Seite schiebe. Wenn meine Freunde darauf schauen, ist das Bild außermittig.

Hier ist die Website ; Wenn Sie sich auf einem 13,5-Zoll-Bildschirm befinden, wird dieser in der Mitte angezeigt.

29
connor.p

Wäre es nicht akzeptabel, nur ein einfaches <center></center> Etikett?

Ich muss hier etwas vermissen, wenn nicht. Fühlen Sie sich frei zu erklären, warum in einem Kommentar. Ich liebe Webdesign und deine Seite ist sehr beeindruckend. Ich könnte vorschlagen, etwas zu tun, um die Ladezeit zu verringern, das ist ein bisschen wie ein Ausschalten.

- Von einem MC-Fan zum anderen :)

EDIT

Ich habe mir nur Ihren Code angesehen ... autsch!

<center></center> 

<center><body onload="MM_preloadImages('../logo-glow.png')"> 
<a href="homepage.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('minecraft2','','../logo-glow.png',1)"><img src="../log-noglow.png" name="minecraft2" width="998" height="222" hspace="0" border="0" align="absmiddle" id="minecraft2" /></a></body></center> 

Versuchen Sie, Formatierungs-Tags nicht außerhalb des Körpers zu platzieren. Stelle das <center> innerhalb des Body-Tags. Es funktioniert, weil es den strengen Regeln von HTML auf niedriger Ebene folgt. Allerdings sind nicht alle Browser so nett und einige zeigen Ihre Seite möglicherweise falsch an, es sei denn, dieses Problem ist behoben!

31
Freesnöw

Versuchen Sie so etwas ...

<div id="wrapper" style="width:100%; text-align:center">
<img id="yourimage"/>
</div>
76
Thomas Shields

In Ihrem speziellen Fall können Sie das enthaltende a -Element folgendermaßen festlegen:

a {
    display: block;
    text-align: center;
}

JS Bin Demo .

9
David Thomas
<div style='width:200px;margin:0 auto;> sometext or image tag</div>

das funktioniert horizontal

7
user1468562