如何隐藏 HTML
我发现在Mozilla主页的中心,有一个 周围的边框。元素,箭头仍然有边框。我在 Windows 上使用 Firefox 4。
请参阅随附的屏幕截图。上半部分显示 Facebook 上的下拉列表,下半部分显示 Mozilla 上的下拉列表。
I found that in the center of Mozilla home page, there is a <select> element (drop-down list) whose arrow has no border and background color. While on facebook sign-up page, the drop-down arrow has the windows standard border and background color. I am wondering what makes this difference? I tried to set border
to none
in CSS, but it only hides the border around the whole <select> element, the arrow still has border. I am using Firefox 4 on Windows.
See attached screenshot. The upper half shows the drop-down list on Facebook, while the lower half shows the drop-down list on Mozilla.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
当
select
元素的border
css 属性未被覆盖时,它会尽可能地呈现为原生(mozilla 的情况)。另一方面,当指定了 border 属性时,浏览器会尝试用边框渲染select
并牺牲它的一些本机外观(facebook 的情况)。或者,也许它会尝试渲染没有边框的本机组合框,然后在其周围绘制边框。无论如何,当指定边框时,组合框需要以不同的方式在窗口或浏览器上绘制。
仅供参考,我在 win7 中使用了经典主题,而 mozilla 的
select
按钮看起来就像任何其他经典 Windows 按钮:灰色和 3D:When the
border
css property of theselect
element isn't overridden, then it's rendered as native as possible (the mozilla's case). When, on the other hand, the border property is specified, browser tries to renderselect
with a border and sacrifices some native look of it (facebook's case).Or, maybe, it tries to render the native combobox without border and then draws border around it. Anyhow, when the border is specified, combobox needs to be drawn in different ways windows-wise or browser-wise.
And FYI, I've got the classic theme in win7 and mozilla's
select
button looks like any other classic windows button: gray and 3D:您看到的不是一个选择,而是一个输入字段,旁边还有另一个图像类型的输入字段。图像输入充当表单的提交按钮。他们的 html 如下:
顺便说一下,如果您运行的是 firefox,我建议您获取 firebug 附加组件。然后您可以右键单击任何元素并检查它。
What you see there is not a select, but an input field with another input field of type image right next to it. The image input acts as a submit button for a form. Their html for it is as follows:
By the way, if you are running firefox, I would recommend getting the firebug add-on. Then you can right click on any element and inspect it.