更改 jQuery Mobile 页脚按钮的高度

Posted 2023-05-09

【中文标题】更改 jQuery Mobile 页脚按钮的高度

【英文标题】：Change height of jQuery Mobile footer buttons

【发布时间】：2019-02-10 18:30:42

【问题描述】：

场景：

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

待办事项：

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

代码：

<!-- 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 -->

【问题讨论】：

页脚的父元素是body还是容器？

是身体。

【参考方案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>

类似的东西。

【讨论】：

我不确定您的应用会如何反应，但请告诉我们。

完全是我的初学者错误。非常感谢，成功了！