根据设备屏幕尺寸自动将图像定位在图像上

时间:2013-11-25 14:10:41

标签: android jquery css html5 jquery-mobile

我有一个更大的图像,我在其上放置了特定位置的较小图像。当我在不同的设备上运行我的应用程序时,较小的图像会从指定的位置放错位置。以下是代码。请提出解决方案。

       <div data-role="content" data-theme="e">
            <img id="m1" src="images/MTsupermarket.jpg" width="600" height="500" style="float:left; display:inline; margin-left:200px">
            <div style="position: absolute;top:112px;left:387px;">
                <a href="#options" data-rel="dialog" data-transition="flow"><img class="img1" src="images/cctvleft.jpg"></a>
            </div>
            <div style="position: absolute;top:205px;left:460px;">
                <img src="images/area1.jpg">
            </div>
            <div style="position: absolute;top:268px;left:576px;">
                <img src="images/area2.jpg">
            </div>
            <div style="position: absolute;top:300px;left:676px;">
                <img src="images/area3.jpg">
            </div>
        </div>

1 个答案:

答案 0 :(得分:0)

我发现使用Android布局重叠图像非常难以执行。

我建议的一件事是缩放所有图像并将它们放在适当的文件夹中并使用

"wrap_content"

长度和宽度。我不会设置绝对位置(绝对布局已弃用)我宁愿尝试设置边距。