web-dev-qa-db-ja.com

すべての画面サイズの画像をWebページの中央に配置する方法

HTMLに問題があります。インターネットで検索しましたが、まだ本当の答えはありません。

いくつかの画像を含むウェブサイトがあり、それらを中央に配置したいです。今、私の画面ではそれらは真ん中にありますが、それはそれらを片側に動かしてそこに置いたからです。私の友人がそれを見るとき、画像は中心から外れています。

こちらがウェブサイトです ; 13.5インチの画面を使用している場合は、中央に表示されます。

htmlcsscenteringtext-align
29
connor.p

単純な<center></center>タグだけを使用することは受け入れられないでしょうか？

そうでない場合は、ここで何かを見逃しているに違いありません。コメントで理由を自由に説明してください。私はウェブデザインが大好きで、あなたのサイトはとても印象的です。ロード時間を短くするために何かをすることを提案するかもしれません。

-MCファンから別のファンへ:)

[〜＃〜] edit [〜＃〜]

私はあなたのコードを見てみました...痛い！

<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>

書式タグを本文の外側に置かないようにしてください。 bodyタグ内に<center>を配置します。 HTMLの低レベルの厳格な規則に従っているため機能しますが、すべてのブラウザーがこのニースであるわけではなく、この問題を修正しない限り、一部のブラウザーが誤ってページを表示する可能性があります！

31
Freesnöw

このようなものを試してみてください...

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

特定のケースでは、含むa要素を次のように設定できます。

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

JS Binデモ 。

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

これは水平に機能します

7
user1468562