ホームページ >ウェブフロントエンド >htmlチュートリアル >サイズが不明な画像は縦方向中央に配置_html/css_WEB-ITnose

サイズが不明な画像は縦方向中央に配置_html/css_WEB-ITnose

WBOY
WBOYオリジナル
2016-06-24 11:51:241412ブラウズ

画像のサイズが不明な場合、DIV で画像を垂直方向と水平方向の中央に配置するにはどうすればよいですか?もちろん、フォームを使用する場合は別の問題です。ここでは、制御のための CSS の使用についてのみ説明します。

水平方向に中央揃えしたい場合は、text-align:center; (Firefox では margin:0 auto;) を使用できます。ただし、CSSで「vertical-align:middle;」を使用しても、imgのalign="absmiddle"を使用しても、垂直方向のセンタリングを実現するのは難しいようです。

以下の方法を見つけたのでまとめてみました。

{

:600px:385px;
ボーダー: 1px ソリッド #f00;

}

.middle-in{

位置: static;

*position:absolute;

Top:50%;

}

.middle-out .middle- img{

HTML 部分:

div>

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。