0

いろいろ調べましたが、それに近いものは見つかりませんでした..

画像を中央に配置した水平線を作成したい..HRタグまたは別の方法でこれを達成する最良の方法は何ですか?

これは私が使用したい画像です: http://www.dylanvanheugten.nl/images/logo.png

前もって感謝します！

4

5 に答える 5

0

HTML:

<div class="line">
    <img src="http://www.dylanvanheugten.nl/images/logo.png" class="lineImg">
</div>

CSS:

.line {
    border-bottom: 1px solid black;
    text-align:center;
    height:17px;
    margin-bottom:17px;
}

.lineImg {
    background-color:white;
    padding:0px 5px 0px 5px;
}

参照: http://jsfiddle.net/V5wj6/3/

の高さと margin-bottom は.line、img の高さのちょうど半分である必要があります。このようにすると、画像は線の垂直方向の中央に配置され、次のコンテンツは境界線の真下にはなりません。

この.lineImgスタイルでは、背景色は img の下の行を削除することで見栄えを良くし、パディングはスペースを増やします。背景色をページに合わせて調整する必要があります。

于 2013-08-09T08:20:25.363 に答える
0

この記事を参照できます。おそらく、すべてのブラウザー (または少なくとも関心のあるブラウザー) をカバーするソリューションを見つけることができます。

http://www.sovavsiti.cz/css/hr.html

于 2013-08-09T08:10:06.467 に答える