更改jQuery Mobile页脚按钮的高度

时间:2018-09-05 14:49:51

标签: jquery html5 css3 jquery-mobile

场景:

  • 我从jQuery Mobile网站上获取了页脚代码,并将其合并到我的文件中。
  • 一切正常,直到我尝试更改高度 页脚按钮。

Todo:

  • 我希望按钮的高度比 底部,但是每次我尝试更改它时,都会留下一个灰色空间 在按钮下方,它们保持相同的高度。

代码:

<!-- FOOTER -->
        <div data-role="footer" data-id="footer" data-position="fixed" style="height: 7.5%;">
            <div data-role="navbar" style="height: 7.5%">
                <ul>
                    <li><a href="#page1">Search</a></li>
                    <li><a href="#page2">Planner</a></li>
                    <li><a href="#page3">Jobs</a></li>
                </ul>
            </div><!-- /navbar -->
        </div><!-- /footer -->

At the bottom, the grey gap can be seen

1 个答案:

答案 0 :(得分:1)

要确保它占视口的7.5%,您可以使用7.5vh。

<div data-role="footer" data-id="footer" data-position="fixed" style="height: 7.5vh;">
  <div data-role="navbar" style="height: 100%">
    <ul>
      <li><a href="#page1">Search</a></li>
      <li><a href="#page2">Planner</a></li>
      <li><a href="#page3">Jobs</a></li>
    </ul>
  </div><!-- /navbar -->
</div>

类似那样的东西。