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