0

如何设置背景图像 url 的高度和宽度

我正在使用 sencha-touch 并构建一个移动应用程序，我有一个带有图像的视图 - Xtype

    var profilePicture = {
        xtype : 'image',
        style : 'margin-top:10px;',
        id : 'profilePhoto',
        src : 'resources/images/profile.png',
        height : '104px',
        width : '84px'
    };

我在面板中添加了这个图像我在我的控制器中使用从服务器获得的 json 值动态设置图像的 src，

src = localStorage.httpServerPrefix + profile.imageURI; // 我得到图片的 URL Ext.getCmp("profilePicture").setSrc(src.);

当我在浏览器中看到时，我觉得，

<div class="x-img" id="profilePhoto" style="margin-top: 10px; height: 104px !important; width: 84px !important; background-image: url(http://127.0.0.1:8080/Milna/user/mphoto/1?version=7); "></div>

div 的高度和宽度分别设置为 104px 和 84px。我的图片大小是 1600px × 1200px，所以不适合上面的 div。是否可以设置背景图片 url 的样式？？？我可以做些什么来设置来自 url 的图像的样式？

4

2 回答 2

1

使用 CSS3 -

div{ background-size: cover; }

当您在 Web 应用程序中使用大图像时。您应该阅读自适应图像

于 2012-10-19T11:37:38.107 回答
1

看看这个重构范围。在这篇文章中，他们已经解释了样式功能。

您的样式将更加一致，更重要的是，当您在几分钟而不是几天内重新设计整个移动应用程序时，它会让您看起来非常好。

样式：'背景：资源/图像/profile.png；宽度：45%'，

于 2012-10-19T11:50:20.243 回答