CSS文字或图片悬浮于另一张图片上，大小宽度适配手机的！

上面是HTML布局，下面是CSS样式

.clearfix {
float: none;
clear: both;
}

.header {
position: relative;
width: 100%;
height: auto;
}

.hd-c {
position: relative;
overflow: hidden;
width: 100%;
height:auto;
-moz-background-size: 100% 100%;
-o-background-size: 100% 100%;
-webkit-background-size: 100% 100%;
-ms-background-size: 100% 100%;
}

.hd-c .banner {
width: 100%;
height: auto;
position: relative;
margin: 0 auto;
}

.content {
text-align:center;

}

.banner .frame {
position: absolute;
top:50%;
left:32%;
z-index: 2;
width: 45%;

}

.banner .pic {
position: relative;
width: 100%;
height: auto;
text-align: center;
}

.banner .png-24 {
_display: none;
width: 100%;
height: auto;
margin: 0 auto;
}

.banner .frame .changing-over{float:left;margin:1px 0 1px 1px;width:100%;height:auto;text-align:center}

注：红色框部分即悬浮的图片，是个动态的Gif图片进度条