Question

出于某种原因，我无法在iPhone上的Safari或Chrome上显示CSS box-shadow。这是代码：

input.error {
  box-shadow: 0 0 5px 1px rgba(224, 39, 14, 1);
  -webkit-box-shadow: 0 0 5px 1px rgba(224, 39, 14, 1); 
  -moz-box-shadow: 0 0 5px 1px rgba(224, 39, 14, 1);
}

代码正在HTML输入字段上使用，这会导致任何问题吗？我做错了什么？

在浏览器中显示正常...

Answer 1

如果在表单块中，请添加

-webkit-appearance: none;

iPhone可以搞乱表格。请参阅here。

Answer 2

尝试添加-webkit-appearance: none; iOS往往会搞乱表单。

Answer 3

我已经尝试过互联网上列出的所有内容，以静态方式解决此问题。我唯一可以使用的方法是使用-webkit-box-shadow样式，但是要像这样添加＃222：

-webkit-filter：阴影（0.5px 1px 1px＃222）;

Answer 4

因为你写错了试试这个：

-webkit-box-shadow: 0 5px 1px rgba(224, 39, 14, 1);

你只需要写3个尺寸

Answer 5

就我而言，我修复了添加所有这些规则：

-webkit-appearance: none;
border:0;
border-radius: 1px;
height: 1px;

特别设置 height。

CSS Box Shadow无法在iPhone上运行

5 个答案: