14

出于某种原因，我无法在 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 输入字段中使用，这会导致任何问题吗？我究竟做错了什么？

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

4

5 回答 5

32

如果这是在表单块中，请添加

-webkit-appearance: none;

iPhone 会弄乱表格。见这里。

于 2013-03-15T19:29:31.903 回答
6

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

于 2013-03-15T19:30:03.877 回答
2

因为你写错了
试试这个： 

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

你只需为它写 3 个尺寸

于 2013-03-15T19:29:37.890 回答
1

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

-webkit-filter: 阴影(0.5px 1px 1px #222);

于 2020-07-25T14:11:38.370 回答
0

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

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

In particular setting also the height.

于 2021-03-31T14:29:41.430 回答