开发者

background image not shown in div elements in mobile jquery

I have set a background image for a mobile page with mobile.jquery. So far so good, but.... I link to the cdn version of jquery css file like:

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0b2/jquery.mobile-1.0b2.min.css" />

Apparently this css file sets a background for my content divs. When I remove this css file, the background image is shown through all my divs which have no background set.

I dislike to not use this default css file from CDN, but how can I overwrite the background in my own .ui-body-c ??

This is the complete css for ui-body-c (build-in from mobile.jquery http://code.jquery.com/mobile/1.0b2/jquery.mobile-1.0b2.min.css):

.ui-body-c
{
border-top-width: 1px;
border-right-width-value: 1px;
border-right-width-ltr-source: physical;
border-right-width-rtl-source: physical;
border-bottom-width: 1px;
border-left-width-value: 1px;
border-left-width-ltr-source: physical;
border-left-width-rtl-source: physical;
border-top-style: solid;
border-right-style-value: solid;
border-right-style-ltr-source: physical;
border-right-style-rtl-source: physical;
border-bottom-style: solid;
border-left-style-value: solid;
border-left-style-ltr-source: physical;
border-left-style-rtl-source: physical;
border-top-color: #b3b3b3;
border-right-color-value: #b3b3b3;
border-right-color-ltr-source: physical;
border-right-color-rtl-source: physical;
border-bottom-color: #b3b3b3;
border-left-color-value: #b3b3b3;
border-left-color-ltr-source: physical;
border-left-color-rtl-source: physical;
color: #333333;
text-shadow: #ffffff;
background-color: #f0f0f0;
back开发者_运维技巧ground-repeat: repeat;
background-attachment: scroll;
background-position: 0% 0%;
background-clip: border-box;
background-origin: padding-box;
background-size: auto auto;
background-image: #eeeeee;
}


Two things.

First, you could simply add !important to your own CSS definitions.

Second, background-image: #eeeeee; is invalid CSS. Valid property values for background-image are url(path/to/image.png), none, or inherit.

Create a file on your own server called overrides.css (or anything-you-want.css), or alternatively you can define it on the page by adding a <style> element within the <head> element of you HTML. Inside that file (or <style> element), add the following:

.ui-body-c {
    background-image: url(path/to/image.png) !important;
}
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜