1

流体グリッドシステムを使用して、ブートストラップサイトのすべての「ウェル」divの上部中央に装飾を追加したいと思います。これは現在機能しているようです

.well {
    position: relative;
}
.well:before {
    content: url("http://placehold.it/20/E8117F");
    top: -10px;
    left: 45%;
    position: absolute;
}

しかし、これleft: 45%はそれを中心に置くための単なる概算です、それを行うためのより良い方法はありますか?

これが私のフィドルですhttp://jsfiddle.net/sguha095/WRB9F/

4

2 に答える 2

2

コンテンツが固定幅(たとえば50px)の場合、設定できます

left: 50%;およびmargin-left:-25px;(幅の半分)。

于 2012-10-18T00:07:58.477 に答える
0

あまり知られていない事実は、CSSが画像をテキストとして扱うということです。その機能を使用してspan、画像の周りにタグを付け、そのスタイルをtext-align: center次のように設定します。

HTMLコード:

<span class="centerImage"><img src="..." /></span>

CSSコード:

span.centerImage {
     text-align: center;
}

画像が中央に配置されます。

于 2012-10-18T00:43:31.180 に答える