CSS：如何将对象移动一层？

HTML：CSS：如何将对象移动一层？

<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，我该怎么办？

来源

2012-04-09 Yishu Fang

'位置：relative'和'z-index' ar e你的朋友。 – Marcel 2012-04-09 04:51:40

只需在#b上使用position:relative和z-index:10即可。

演示：jsfiddle.net/Marcel/mxtdg/7/

来源

2012-04-09 04:54:02 Marcel

你不觉得'位置：亲戚'使它横向而不是一个在其他之上？ – uday 2012-04-09 04:56:30

您也可以浮动的“B”那你用保证金调整位置。当它们都浮动时，在这种情况下，你不需要改变z索引，因为HTML的顺序，“b”将位于“a”之上。

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

来源

2012-04-09 04:59:13 Dudeman3000

它的简单，你可以定义位置和的z-index当你将定义一个价值的任何股利或ID您在上面要记住一件事的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-09 05:10:43

CSS：如何将对象移动一层？

回答

相关问题