在我的jQuery mobile 1.4.0应用程序中,我有一个包含列表视图的页面问题是,当我为此页面添加了背景图像时,随着背景随着内容的延伸,列表元素变得越来越大移动设备上的数据明显多于jsFiddle,这是我的jsfiddle。
如何将背景图像设置为全屏并固定,而不是使用内容拉伸?请帮帮我..
这里我如何向我的页面添加背景图片:
#EmPListPage{
background-image: url('http://images2.layoutsparks.com/1/218610/just-ducky-dots- pinky.gif') !important;
background-repeat: no-repeat;
background-size: 100% 100%;
}
#PageContent{
background: transparent ;
}
答案 0 :(得分:1)
在我的情况下,解决方案是使用contain
,如下所示:
.ui-page {
background: #000;
background-image: url("http://bettingmasters.info/wp-content/uploads/2013/11/19757-football-stadium-1920x1200-sport-wallpaper.jpg");
background-size: contain;
}
答案 1 :(得分:0)
您需要将背景图像附加到文档body
而不是容器div。在小提琴中使用CSS:
body {
background-image: url('http://images2.layoutsparks.com/1/218610/just-ducky-dots-pinky.gif') !important;
background-repeat: no-repeat;
background-size: 100% 100%;
}
#EmPListPage, #PageContent{
background: transparent ;
}