JQuery Mobile 的 CSS 文件是否是设置 Mobile Navbar 样式所必需的?
Is the CSS file for JQuery Mobile necessary for styling a Mobile Navbar?
所以我有以下代码片段,它是我从 JQuery 移动导航栏的一个演示中复制的:
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css" />
<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
<div data-role="footer">
<div data-role="navbar">
<ul>
<li><a href="#" data-icon="grid">Summary</a></li>
<li><a href="#" data-icon="star" class="ui-btn-active">Favs</a></li>
<li><a href="#" data-icon="gear">Setup</a></li>
</ul>
</div><!-- /navbar -->
</div><!-- /footer -->
这确实按预期工作。但是,我的问题是 css
文件我必须 link 到我的代码中,这会覆盖我的很多 style.css
文件(例如 background-color
)。我的问题是,.min.css
文件是否真的是移动导航栏正常工作所必需的,或者是否有其他方式来设置它们的样式?也许可以在不同的 HTML 页面中声明此 Navbar 并在我要使用它的页面中调用它?
任何帮助。谢谢。
您可以使 style.css 选择器更具体,也可以使用 !important。
您可以使用 iframe 将导航栏放在另一个 HTML 中。
如果您的 style.css link 标记在 jquery.mobile css 之后并且它们具有相同的选择器,则后一个将覆盖前一个。
所以我有以下代码片段,它是我从 JQuery 移动导航栏的一个演示中复制的:
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css" />
<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
<div data-role="footer">
<div data-role="navbar">
<ul>
<li><a href="#" data-icon="grid">Summary</a></li>
<li><a href="#" data-icon="star" class="ui-btn-active">Favs</a></li>
<li><a href="#" data-icon="gear">Setup</a></li>
</ul>
</div><!-- /navbar -->
</div><!-- /footer -->
这确实按预期工作。但是,我的问题是 css
文件我必须 link 到我的代码中,这会覆盖我的很多 style.css
文件(例如 background-color
)。我的问题是,.min.css
文件是否真的是移动导航栏正常工作所必需的,或者是否有其他方式来设置它们的样式?也许可以在不同的 HTML 页面中声明此 Navbar 并在我要使用它的页面中调用它?
任何帮助。谢谢。
您可以使 style.css 选择器更具体,也可以使用 !important。
您可以使用 iframe 将导航栏放在另一个 HTML 中。
如果您的 style.css link 标记在 jquery.mobile css 之后并且它们具有相同的选择器,则后一个将覆盖前一个。