html - 为什么我的 HTML 列表没有显示在 Firefox for mobiles 中？

Question

我正在使用 jQuery Mobile v 1.4.2。以下是我页面中的代码。

HTML

<ul data-role="listview" class="ui-nodisc-icon ui-alt-icon">
  <li><a href="#" >Bienes Ra&iacute;ces en San Jos&eacute;</a></li>
</ul>

CSS

.ui-listview li 
{ 
   margin: 10px !important;
   border-radius: 5px !important;
   border-left:1px solid !important;
   border-right:1px solid;
   background-color: #C0DAE7;
}

.ui-listview li:hover 
{    
   background-color: #EDF6FA;
}

.ui-listview 
{
  -moz-box-shadow: none !important;
  -webkit-box-shadow: none !important;
  box-shadow: none !important;
  height:40px;
}

当页面首次在移动设备上加载时，它不会对 css 进行任何更改，例如 background-color 或 border。如果它刷新了两三次，那么它就起作用了。

注意:它不适用于手机版 Firefox。

此行为背后的原因/原因可能是什么。请指教。

Answer 1

更改未显示的原因可能有几个。

1. 并非所有浏览器都以相同的方式解释 html，并且计算边框、边距、填充等内容的方式可能与您预期的不同。
2. 浏览器未检测到 html 中的更改，因为您仅更改了 .css 中的数据，因此 html 没有更改；所以它可能认为缓存版本就足够了。
3. 您不小心通过 ftp 将新的 css 文件保存在错误的位置，因此您认为所做的更改没有显示，因为它正在查看未更改的旧文件。 (这发生在我身上)
4. 服务器只是没有完成保存/覆盖旧文件，需要一分钟才能完成操作；这也可以解释出现变化的滞后。

我有时做的另一件事是弹出到 w3schools HTML validator和 w3schools CSS validator让他们快速浏览一下我的代码，以确保我没有不小心遗漏任何内容；因为错误放置的标签和其他小错误可能会导致输出出现大差异。