方框阴影在输入表单的safari中不起作用
方框阴影在输入表单的Safari中不起作用是因为Safari浏览器对于表单元素的样式渲染有一些特殊的处理方式。在Safari中，输入表单元素（如input、textarea等）的外观样式是由操作系统级别的控件来决定的，而不是完全受CSS样式控制。
这种特殊处理导致了一些CSS样式在Safari中无法生效，包括方框阴影。如果你想在Safari中实现输入表单的方框阴影效果，可以考虑以下几种解决方案：
- 使用其他样式代替方框阴影：可以尝试使用其他样式效果来替代方框阴影，比如边框、背景色等。通过调整这些样式的属性值，可以实现类似的视觉效果。
- 使用JavaScript库：可以借助一些JavaScript库来实现在Safari中的方框阴影效果。这些库通常会通过在输入表单元素周围添加额外的HTML元素或使用其他技术手段来模拟方框阴影效果。
- 针对Safari单独处理：可以通过检测用户使用的浏览器类型，当检测到是Safari时，使用特定的CSS样式或JavaScript代码来实现方框阴影效果。这种方式需要在代码中进行浏览器类型的判断，并针对Safari进行特殊处理。
需要注意的是，以上解决方案都是针对Safari浏览器的特殊处理，可能会增加代码的复杂性和维护成本。在实际开发中，建议根据项目需求和用户群体选择合适的解决方案。
腾讯云相关产品和产品介绍链接地址：
- 腾讯云官网：https://cloud.tencent.com/
- 云服务器（CVM）：https://cloud.tencent.com/product/cvm
- 云数据库 MySQL 版：https://cloud.tencent.com/product/cdb_mysql
- 云原生应用引擎（TKE）：https://cloud.tencent.com/product/tke
- 云存储（COS）：https://cloud.tencent.com/product/cos
- 腾讯云区块链服务（BCS）：https://cloud.tencent.com/product/bcs
相关·内容
我已经应用了所有的东西。 .gf_bottom_address input[type="text"] { border-radius: 5px !important; -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0) !important;
} <input name="input_1" id="input_4_1" t
浏览 7提问于2020-08-28得票数 1
框阴影可以很好地用于输入和选择字段。在桌面上，文本框阴影也工作得很好。即使我将窗口大小调整为移动大小。但当我在iPhone上查看Safari或Chrome上的网站时，文本区域的方框阴影并没有显示出来。输入和选择字段在移动设备上显示得很好。我如何解决这个问题？
浏览 14提问于2021-03-02得票数 0
我在一个图像和一个div周围设置一个边界半径。目前我只在Safari和Firefox中测试。两者产生不同的结果。Safari -左侧半径不平滑，看起来角落被砍掉了一点。border-top-right-radius: 46px;-moz-border-bottom-right-radius: 46px;我是不是明显
浏览 0提问于2013-07-21得票数 0
我喜欢使用边框和方框阴影插入的效果，但只有"Chrome“支持插入负值0px, 0px, -1px。然而，当我查看FF、Safari和IE时(opera我没有，但我打赌它也不支持它)……根本就没有方框阴影。当我用firebug检查元素并尝试输入box-shadow: 0px 0px 1px rgba(255,255,255,0.7) inset时，它出现了，但没有输入-1px。则该值无效。
浏览 8提问于2012-08-08得票数 0
回答已采纳
1回答
更改输入自动填充样式
、、、
我有白色背景和深色文本的输入，但当我输入时，浏览器自动完成，样式就会改变。我知道浏览器可以做到这一点，我已经在Chrome上找到了修复方法，但在Safari和Firefox上却没有。在safari中，文本仍然变成白色(奇怪的是，当我第二次保存文本编辑器时，它变成了我写的颜色)。Firfox仍然将背景设置为黄色。下面是我输入的当前代码。
浏览 0提问于2020-07-04得票数 0
box-shadow: 3px 3px 6px 6px;我试着这样写，但不起作用
-webkit-box-shadow
浏览 0提问于2013-09-23得票数 7
3回答
moz-border-radius: -5px -5px 5px 5px #888;}box-shadow: -5px -5px 5px 5px #888;
请告诉我解决方案。
浏览 0提问于2011-10-03得票数 0
回答已采纳
在我的例子中，Win7的Sarari中的方框阴影就可以了。
但在Mac上却不起作用。我应该使用-webkit-box-shadow吗？但是为什么窗口中的方框阴影是可以的呢？
浏览 5提问于2012-02-07得票数 0
回答已采纳
2回答
我有一个表单，我希望用户应该输入特定格式的边框css代码。-- Expecting this should be readonly --> 输入值的格式应为"Npx solid #color“ 如1px dotted #FF0000 / 2px grooveborder-style border-color格式的输出，并将值放在只读输入中？(在我的示例中，在</em
浏览 45提问于2021-07-04得票数 2
1回答
通常，我不关心不同浏览器中框阴影渲染的细微差别，但在这种情况下，框阴影的大小是很重要的。IE9和IE10呈现一个。Explorer9可以使用条件注释修复更大的方框阴影，但IE10似乎已经消除了对条件注释的支持。有没有办法调整IE10的框影大小，让它像safari，chrome，firefox那样稍微大一点？我知道它有点类似于，但也许有人有一个只能在IE9/10或IE10<
浏览 2提问于2012-11-06得票数 2
回答已采纳
我试图在PhpDesigner 7上使用方框阴影属性，当我输入代码，语法，如方框阴影，它就会给我语法错误。非盒子阴影代码在PhpDesigner 7中正常工作。我不想切换到另一个IDE，只是为了长方体阴影，但我仍然需要在我的网站上使用它。请给我提个建议。
谢谢，萨拉
浏览 0提问于2011-06-22得票数 0
样式表有一个:focus类，当表单字段被聚焦时，它会给它们一个蓝色的方框阴影：input.error { outline: none; -webkit-box-shadow: 0px它不能在IE8或7中工作。(当我们停止
浏览 2提问于2012-09-11得票数 0
回答已采纳
我在Webkit中遇到了多个text-shadow和负数letter-spacing的问题，其中最后一个字母上的阴影的最后几个像素被切断了。嗯，只有特定的字母。看看Chrome或Safari中的 (据我所知，它在火狐和Opera中的工作方式与预期一致)。
浏览 0提问于2011-11-22得票数 4
回答已采纳
我一直试图在输入框中添加一些时髦的效果，其中一个是框跟踪，我查看了w3schools的框跟踪教程，并尝试了多种方法将其添加到输入框中： box-shadow: 10px;.l_input {}
浏览 4提问于2016-01-13得票数 5
回答已采纳
我有一个从无序列表中创建的12个方框的网格，如下所示。边界半径可以正常工作，但是IU不能让阴影出现。box-shadow属性是否只适用于div，而不适用于显示块元素？
浏览 2提问于2011-05-13得票数 0
4回答
其他人有没有注意到IE9的CSS方框阴影的“标准”实现与其他浏览器不同？每当我使用长方体阴影并设置模糊值时，IE9呈现的模糊值似乎是火狐、Safari、Chrome和Opera值的一半左右。如果IE9支持长方体阴影作为标准属性，如果它在所有其他浏览器中看起来与长方体阴影不同，那么它到底有什么意义？(从技术上讲，Safari5仍然只支持-webkit-box-shadow，而不是标准的</em
浏览 1提问于2011-05-13得票数 14
回答已采纳
2回答
我需要有一个方框只显示在侧面。这不是位于div底部的阴影。我的方框阴影css在侧面和底部都有阴影，看起来像这样：阅读我尝试过的stackoverflow上的其他帖子：但不起作用。任何关于如何实现效果的
浏览 0提问于2017-05-15得票数 0
我今天遇到了一个Safari (版本11.0 (12604.1.38.1.7)，边界半径和一个大的扩散投影)的问题。此问题在Chrome、FF或Edge中不会发生。大投影的原因是为了实现类似窗口的效果，其中元素是可见的，并且投影是半透明的，覆盖整个屏幕。在解决了一些问题之后，我决定在Safari中放置阴影效果很好，但是当扩散非常大时(比如这里)，当容器的边界半径都匹配时就不行了。调
浏览 0提问于2017-10-24得票数 2
6回答
iOS设备在表单输入上添加了很多恼人的样式，尤其是在inputtype=submit上。下面显示的是桌面浏览器和iPad上相同的简单搜索表单。桌面：iPad：inputtype=text使用了一个CSS方框阴影插页，我甚至指定了-webkit-border-radius:none；它显然被覆盖了。在iPad上，我的inputtype=submit按钮
浏览 0提问于2011-09-29得票数 95
回答已采纳
我想做一个带有梯度的div :从白色到透明。我添加了一个红色的弓形阴影在它上面，但我需要的方框阴影效果尊重相同的渐变透明度比方框她自己！就像我们看到的，这不是很好，我不希望在我的div左边有红色的效果。我尝试过box-shadow(0px 0px 2px 1px linear-gradient(90deg, rgba(0,0,0,0) 0, red 10%, re
浏览 1提问于2014-10-01得票数 0
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
实时音视频
即时通信 IM活动推荐
腾讯云开发者
