0 
.spotlight-area img {
    width: 100px; 
    height: 100px; 
    margin-top: 30%; 
    margin-left: 40%; 
}

spotlight-areaランダムな幅と高さの div になります。私が使用している画像は100px（100pxリサイズ）です。margin-top と margin-left で中央に配置しようとしましたが、それは安っぽい回避策のように見えます。

何を提案しますか？

Ps。ビデオ コンテナ div の上に表示される再生ボタンです。

4

4 に答える 4

1

CSS-Tricksに関するChrisCoyierによるこの記事をチェックしてください。私はそれが役立つかもしれないと思います。私は数日前に同じ問題に遭遇し、彼の答えは私のために働いた。

画像を水平方向と垂直方向に中央揃え

基本的には、画像の幅と高さが設定されているかどうかという考え方です。左と上から50％の絶対位置に配置してから、幅と高さの半分に等しい負のマージンを作成して、デッドセンターに戻すことができます。寸法が設定されていない場合、画像を垂直方向に中央揃えにする他の方法です。

于 2013-02-08T11:31:44.667 に答える
1 
vertical-align: middle;
text-align: center;

それはあなたを助けます...

このリンクのclck

于 2013-02-08T11:32:38.913 に答える
0

Mybeこれはうまくいくでしょう：

   .spotlight-area { text-align: center; }
于 2013-02-08T11:30:24.210 に答える
0

私はこれがうまくいくと思います、試して知らせてください...

 .spotlight-area img {
        width: 100px; 
        height: 100px; 
        text-align: center;
    }
于 2013-02-08T11:33:14.447 に答える