css - 移动设备忽略我的 css 规则，为什么？

Question

我的移动菜单有以下 css 规则，但问题是它忽略了我移动设备上的 postion 语句，但没有忽略我的桌面浏览器(Chrome、Firefox IE 等)

CSS 规则:

background:#000 url("images/nav-icon.png") no-repeat;background-position:
right 15px top 10px; (DISPLAYED AT THE TOP LEFT *)

也尝试过这些组合。

background-image:url("images/nav-icon.png");background-repeat:no-repeat;
background-position:right 15px top 10px; (DISPLAYED AT THE TOP LEFT *)

background:#000 url("images/nav-icon.png") right 15px top 10px no-repeat;
(NOT DISPLAYED AT ALL *)

* 在移动设备上。

其中一个根本没有显示，但在左上角显示了两个。看看上面哪一个。

现在我的问题是，我的组合有问题还是移动设备不支持这些组合？

提前致谢 jack

Answer 1

有些移动设备无法做到这一点。即 iPhone 或 Webkit 浏览器。

尝试寻找另一种方式(如果你用谷歌搜索，有很多 css hacks)或使用 javascript!

确保在多台设备上测试您的网站。我去 Future Shop 或 Bestbuy 并在平板电脑、大屏幕计算机和一系列移动设备上测试我的响应式网站/网络应用程序。