我正在研究CSS设计模板.
我有两个图像imageOne和imageTwo.
两者都是位置：相对,因为如果我设置其中的一个位置：绝对,那么它不再保持响应,响应性是这里的关键.
我想要的是将imageTwo放在imageOne的顶部.
当twitterbootstrap的响应功能仍然适用于这两个图像时,我该如何实现？
以下是我的代码：(jsfiddle available here)
<div class="imageOne image"></div> <div class="imageTwo image"></div>
CSS
.image {
position: relative;
width: 100px;
height: 100px;
border: 1px solid red;
}
.imageOne {
z-index: 0;
}
.imageTwo {
z-index: 1;
}
解决方法
我为这些图像添加了一个包装div,位置相对和更改.image {position：相对于绝对,它适用于我.
http://jsfiddle.net/uS7nw/2/
http://jsfiddle.net/uS7nw/2/
<div class="container">
<div class="imageOne image"></div>
<div class="imageTwo image"></div>
</div>
和
.container {
position: relative;
}
.image {
position: absolute;
width: 100px;
height: 100px;
border: 1px solid red;
}
