0

HTML：

<div id="a">A</div>
<div id="b">B</div>

CSS：

#a {
    float: left;

    width: 30px;
    height: 30px;
    color: white;
    background-color: red;
    border: 1px solid black;
    text-align: center;
}

#b {
    margin-left: 25px;

    width: 30px;
    height: 40px;
    color: white;
    background-color: green;
    border: 1px solid black;
    text-align: center;
}

ここで私のコードを参照してください：http：//jsfiddle.net/mxtdg/ ;

AがBより上にあるようですが、BをAより上にしたい場合はどうすればよいですか？

4

3 に答える 3

3

使用するだけでposition:relative、それでうまくいきます。z-index:10#b

デモ：jsfiddle.net/Marcel/mxtdg/7/

于 2012-04-09T04:54:02.793 に答える
0

「b」をフロートさせることもできます。次に、マージンを使用して位置を調整します。両方がフローティングの場合、この場合、z-indexを変更する必要はありません。HTMLの順序により、「b」が「a」の上に表示されます。

http://jsfiddle.net/mxtdg/12/

于 2012-04-09T04:59:13.693 に答える
0

簡単に、上で必要な任意のdivまたはidに位置とz-index値を定義できます。また、z-indexが機能するのは、上で必要な特定のdivまたはidの位置を定義する場合のみです。

更新されたコードを参照してください：-

HTML

<div id="a">A</div>
<div id="b">B</div>

CSS

#a {
    float: left;
    width: 30px;
    height: 30px;
    color: white;
    background-color: red;
    border: 1px solid black;
    text-align: center;
}

#b {
    margin-left: 25px;
    width: 30px;
    height: 40px;
    color: white;
    background-color: green;
    border: 1px solid black;
    text-align: center;
    position:relative;
    z-index:10;
}

またはデモを参照してください：-http：//jsfiddle.net/mxtdg/19/

于 2012-04-09T05:10:43.110 に答える