Question

嘿所有我想在下面的代码中禁用主题/样式的固定标题：

<div id="home-header" data-role="header" data-id="mobile-header" role="banner" 
 data-position="fixed" style="background-color: #FF8040; 
 class="ui-header ui-header-fixed slidedown" 
 -webkit-box-shadow: 0px 0px 8px 2px #000000; 
 -moz-box-shadow: 0px 0px 8px 2px #000000; box-shadow: 0px 0px 8px 2px #000000;">
    <span class="ui-title" role="heading" aria-level="1">
        Temp text here
    </span>
</div><!-- /Header -->

我已经尝试过使用 data-role =“none”，但这只会弄乱固定的标题（导致它只是漂浮在屏幕的底部）。我还尝试将 class = 取出来，但是一旦页面被渲染，它似乎会自动将它放回到代码中。

有没有这样做而不会搞乱JMobile中固定标头的正常操作？

感谢。

更新＃1

#home-header {
        background-color: #FF8040 !important; 
        -webkit-box-shadow: 0px 0px 8px 2px #000000 !important; 
        -moz-box-shadow: 0px 0px 8px 2px #000000 !important; 
        box-shadow: 0px 0px 8px 2px #000000 !important;
}

<div id="home-header" data-role="header" data-id="mobile-header" data-position="fixed" role="banner">
    <h1 class="ui-title" role="heading" aria-level="1">
        Temp test here
    </h1>
</div><!-- /Header -->

更新＃2

.ui-bar-a {
        border: 1px solid #FFA346 !important;
        background: #FF8040 !important;
        -webkit-box-shadow: 0px 0px 8px 2px #000000 !important; 
        -moz-box-shadow: 0px 0px 8px 2px #000000 !important; 
        box-shadow: 0px 0px 8px 2px #000000 !important;
}

Answer 1

工作示例：http://jsfiddle.net/aJXXx/

必须用！important：

覆盖jQuery Mobile中的每个css更改

#home-header {
    background: none !important;
    text-shadow:  none !important;
    color: red !important;
}

Jquery Mobile在固定标头上禁用样式

1 个答案: