1

ボタンをページに固定しようとしています。私はプロではありませんが、ここにあります。

body {
    width:100%;
    height:100%;
    background:#181516;
    overflow:hidden;
    position:absolute;
}

.bg {    
    background:url(../images/entrance.jpg) no-repeat center center ; 
    height:100%;
    z-index:1;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

そしてボタン。

.door {
    display:inline-block;
    width:170px;
    margin-top:22%;
}

しかし、小さい画面またははるかに大きい画面では、ボタンは好きな場所に移動します:D

正方形に固定する必要があります。後ろの写真は小さなドアです。ボタンはそのドアの内側にある必要があります... MARgin またはパディング px または % は常に同じです。手伝って頂けますか？

4

1 に答える 1

0

私がそれを正しく理解していれば、つまり、常に画面の中央に留まる div が必要だということです。

基本的にこれを行う方法は、画面の上部と左側から絶対的で 50% の位置に配置することです。次に、divの左上のポイントが中央にあるので、divのサイズの半分を負のマージンとして使用して位置を中央に戻すことを修正します。

したがって、基本的には次のとおりです。

.door{ 位置: 絶対;
上:50%;
左:50%;
幅:170px;
高さ:200px;
マージン左:-85px;
マージントップ:-100px;
背景色:#fff;
}

于 2012-12-17T12:44:12.320 に答える