Question

我正在使用jQuery mobiles 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;
}

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

注意：它无法在Firefox for mobiles中使用。

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

Answer 1

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

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

我有时会做的另一件事是跳到w3schools HTML validator和w3schools CSS validator，让他们快速查看我的代码，以确保我没有意外遗漏任何东西;因为错放的标签和其他小错误会导致输出中存在大差异。

Answer 2

有时候缓存就是这种行为的原因。按alt + ctrl + Delete清除浏览器的缓存并检查它。希望这会有效..

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

HTML

CSS

2 个答案: