1

<img>の中心にしたい があります<div>。ここで見つけた以前の回答はすべて、ハックを使用するか、画像の幅を知る必要がありますが、これは私の場合は異なります。

親での水平方向のセンタリングtext-align: centerは簡単です。縦に並べる方法がわかりません。

jsFiddle の例

参考までに、Facebook は HTML と CSS だけを使用してこれをうまく行っています。したがって、no<table>または javascript ハックしてください。垂直方向の中央line-heightに何かを使用しているようです。<img>

4

4 に答える 4

3

それ自体では役に立たないことに注意してください。 vertical-align: middle;line-height: も設定する必要がありますline-height:400px;。

<div>これは、 (1 行を除いて) 他のテキストがない場合に便利です。

作業例: http://jsfiddle.net/kobi/ZfMYy/5/

于 2012-12-09T09:10:13.540 に答える
-1

CSS クラスにルールを追加します。

 {vertical-align:middle;}
于 2012-12-09T08:50:56.307 に答える
-1 
html, body, #wrapper {
   height:100%;
   width: 100%;
   margin: 0;
   padding: 0;
   border: 0;
}
#wrapper td {
   vertical-align: middle;
   text-align: center;
}


<html>
<body>
   <table id="wrapper">
      <tr>
         <td><img src="logo.png" alt="" /></td>
      </tr>
   </table>
</body>
</html>
于 2012-12-09T08:51:46.237 に答える
-1

@kobi がコメントで述べたように、必要なのはline-height、含む に a を設定することだけですdiv。テーブルはありません。

垂直方向に中央揃えされた画像の jsFiddle の例

于 2012-12-09T09:08:52.340 に答える