jquery移动响应图像模板

时间:2013-10-16 18:11:00

标签: jquery-mobile responsive-design

首先,抱歉,因为我刚开始使用jquery移动和响应式设计。

我正在尝试使用jquery mobile构建一个用于创建移动应用的模板。

问题在于手机和平板电脑尺寸。

我的测试看起来并不像我想要的那样。我想在图像中构建像节目一样的东西。

http://aprendeinformaticaconmigo.com/images/resposive_app_template.png

有人可以告诉我这对于不同的手机和平板电脑尺寸有什么用?

非常感谢!!

1 个答案:

答案 0 :(得分:0)

喜欢这个? http://jsfiddle.net/rnErL/

很少代码

CSS:

.box {
    max-width:500px;
    width:100%;
    min-height:200px;
    background-color:green;
    margin:5px;
    margin-left:auto;
    margin-right:auto;
}

.bottom-left, .bottom-right {
    width:50px;
    height:50px;
    position:absolute; 
    background-color:green;
}

.bottom-left {
    bottom:5px;
}

.bottom-right {
    bottom:5px;
    right:5px;
}

HTML:

<div class="box"></div>
<div class="box"></div>
<div class="bottom-left"></div>
<div class="bottom-right"></div>