在Chrome中对选定输入使用框阴影 [英] Using box shadow on select inputs in Chrome
问题描述
我目前正在一个小网站上工作,我已经对网站上的各种元素使用了box-shadow效果。除了 select
和输入
。它将在Firefox中的这些输入类型正常工作,但不是在Chrome。任何想法为什么?
我已经应用这个效果使用 box-shadow
, -webkit -box-shadow
和 -moz-box-shadow
支持多种浏览器。
以下是一个解决方法:
HTML:
<
< div>< input type =text/>< / div>
CSS:
code> div {
-webkit-box-shadow:5px 5px 5px#666;
-moz-box-shadow:5px 5px 5px#666;
box-shadow:5px 5px 5px#666;
display:inline-block;
}
演示: http://jsfiddle.net/AlienWebguy/UD2QP/
I am currently working on a small site, and I have used the box-shadow effect on various elements on the site. It seems to work on all the elements where it has been applied, in both Chrome and Firefox, except for select
and input
. It will work fine for these input types in Firefox but not in Chrome. Any ideas why?
I have applied this effect using box-shadow
, -webkit-box-shadow
and -moz-box-shadow
for multiple browser support.
Here's a workaround:
HTML:
<div><input type="text" /></div>
CSS:
div {
-webkit-box-shadow: 5px 5px 5px #666;
-moz-box-shadow: 5px 5px 5px #666;
box-shadow: 5px 5px 5px #666;
display:inline-block;
}
Demo: http://jsfiddle.net/AlienWebguy/UD2QP/
这篇关于在Chrome中对选定输入使用框阴影的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!