Question

我试图摆脱这个按钮上的边框阴影（不是边框本身）。显然我无法发布图片......但这里是HTML：

＆＃13;

<input type="button" value="ok" />

＆＃13;

它就像一个出现在按钮底部和右侧的小阴影。有什么想法吗？

Answer 1

尝试将背景颜色设置为您想要的颜色，它应该去除阴影这样，您可以强制浏览器以纯色渲染按钮。

如果仍然无法在所有浏览器中使用，请制作所需颜色的1x1像素图像，并将其设置为按钮的背景图像。

正如j08691所说，影子不会出现在chrome中。您可能还想查看CSS重置。

Answer 2

设置border: 0至少会删除对chrome的任何阴影效果

Answer 3

不确定您的问题是什么，请将图片发布到imgur。

样式border-style:1px solid;或box-shadow: 0px 0px 0px #000000;将解决您的问题（希望如此）

＆＃13;

fix border and shadow <input type="button" style="box-shadow: 0px 0px 0px #000000; border-style: 1px solid;" value="ok" /><br/>
fix border <input type="button" style="border-style: 1px solid;" value="ok" /><br/>
fix shadow <input type="button" style="box-shadow: 0px 0px 0px #000000;" value="ok" /><br/>
large border <input type="button" style="border-style: 100px solid;" value="ok" /><br/>
create shadow <input type="button" style="box-shadow: 10px 10px 10px #888888;" value="ok" /><br/>

＆＃13;

请注意，并非所有浏览器都显示正确的边框样式宽度

Answer 4

尝试使用与按钮背景颜色相同颜色的边框。如果您的按钮为白色，请尝试以下操作：border:2px solid #fff;。然后就没有影子了。它在各种浏览器中也是一致的。请记住，按钮因操作系统而异。在mac os x上，按钮的defualt样式并没有真正的边界，但在xp中我会想象有一个阴影。希望这有助于告诉我它是否适合你。

如何摆脱按钮上的阴影？

4 个答案: