Question

我正在使用html5，css，jquery mobile来开发一些应用程序。但是html元素和css被jquery-mobile默认样式表（jquery.mobile-1.0.css）覆盖。

我如何克服这个问题？我只是想把我的风格用在我的页面上。例如，如果我在body标签中给出bgcolor =“red”，它将不起作用..

请给我一些建议......

感谢你......

Answer 1

使用CSS，必要时将属性标记为!important。

body { background-color: #f00; }

如果这不起作用，例如因为jQuery Mobile CSS中的另一个选择器会覆盖它，请使用!important：

body { background-color: #f00 !important; }

此处说明了优先规则：http://www.w3.org/TR/CSS21/cascade.html#specificity - 但是，通常只是测试您的规则是否已经有效或者是否需要!important就足够了。

你当然应该做的是在 jQuery mobile CSS之后包含你的样式表。即使没有!important，这也会使样式表中的等权重规则具有更高的优先级。

Answer 2

不是先包含你的style.css，而是最后加载

像

<link href="query.mobile-1.0.css" rel="stylesheet" type="text/css">
<link href="style.css" rel="stylesheet" type="text/css">

Answer 3

bgcolor="red"不是CSS而是HTML属性。

更改您的网站以在jQuery移动CSS之后加载自定义CSS文件。在您的自定义CSS文件中声明您的样式，例如像：

body { background-color: #f00; }

Answer 4

JQuery Mobile创建了主体样式的子类，以便针对您需要更具体的身体背景。

在CSS文件中添加调整，该文件在JQM CSS文件之后声明。

您可以使用以下内容定位每个主题正文背景：

.ui-body-a,
.ui-overlay-a {
/* green 4FFF19 ellipse */
    background-image: -webkit-gradient(radial, center center, 0, center center,     497, color-stop(0, #4FFF19), color-stop(1, #264C73));
    /* Webkit (Chrome 11+) */ 
}

这以主题a为例。学到了一点点汗水。

通过使用它，您可以创建JQM主题滚筒无法提供的径向渐变背景等，为各种径向渐变创建CSS的好页面是所有地方的微软页面：http://ie.microsoft.com/testdrive/graphics/cssgradientbackgroundmaker/default.html。

祝你好运。

Html5 - Css样式被jquery移动样式覆盖

4 个答案: