1

我在 JQM 中使用带有 nativeDroid 主题的这个页面块

<div data-role="page" id="add" data-theme="b">

        <div data-role="header" data-position="fixed" data-theme="b" data-tap-toggle='false'>
            <h1>Add City</h1>
            <a href="#list"><i class="fa fa-reply"></i></a>
            <a id="cityAdd" href="#list"><i class="fa fa-floppy-o"></i></a>
        </div><!-- /header -->

        <div data-role="content">
            <ul data-role="listview">
                <li>
                    <div class="ui-body-inherit ui-corner-all ui-shadow-inset">
                        <input id="cityName" type="text" data-clear-btn="true" placeholder="Enter city..." />
                    </div>
                </li>
            </ul>
        </div><!-- /content -->

        <div class="footer" data-role="footer" data-position="fixed" data-theme="b" data-tap-toggle='false'>
            <h4>Page Footer</h4>
        </div><!-- /footer -->
    </div>

我的问题是集中文本输入。在这种情况下,页眉和页脚会改变它们的位置和大小。它会导致添加类.ui-fixed-hidden。我已经尝试过覆盖它,但是在 css 中依赖关系太多并且没有任何效果。

有没有人有这个问题?

感谢您的回答

4

1 回答 1

3

以下 CSS 似乎有效:

.ui-header.ui-fixed-hidden {
    padding: 0;
    border-top-width: 1px;
    border-bottom-width: 2px;
}
.ui-fixed-hidden a{
    margin-top: 1px !important;
} 

这是一个演示

于 2014-10-16T14:38:50.370 回答