英文:
how to remove firefox's Default Dropdown for input html
问题
在Chrome中，我的输入看起来像这样：
而在Firefox中，看起来像这样：
如何去除默认的Firefox下拉菜单。
英文:
In chrome my input looks like this
and in firefox like this
how to remove that default firefox dropdown.
答案1
得分: 3
-moz-appearance CSS 属性用于在 Gecko（Firefox）中显示一个元素，该元素基于操作系统的主题使用平台本机样式。
-webkit-appearance 属性用于由基于 WebKit 的浏览器（例如 Safari）和 Blink-based 浏览器（例如 Chrome、Opera）实现相同效果。请注意，Firefox 和 Edge 也支持 -webkit-appearance，出于兼容性考虑。
/* Chrome, Safari, Edge, Opera */
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
margin: 0;
}
/* Firefox */
input[type=number] {
-moz-appearance: textfield;
}
这个来自 CSS-Tricks 的示例可以帮助你更多了解 appearance CSS 属性
希望这有所帮助。
英文:
The -moz-appearance CSS property is used in Gecko (Firefox) to display an element using platform-native styling based on the operating system's theme.
The -webkit-appearance property is used by WebKit-based (e.g., Safari) and Blink-based (e.g., Chrome, Opera) browsers to achieve the same thing. Note that Firefox and Edge also support -webkit-appearance, for compatibility reasons.
<!-- begin snippet: js hide: false console: true babel: false -->
<!-- language: lang-css -->
/* Chrome, Safari, Edge, Opera */
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
margin: 0;
}
/* Firefox */
input[type=number] {
-moz-appearance:textfield;
}
<!-- language: lang-html -->
<input type="number" />
<!-- end snippet -->
This example from CSS-Tricks can help you understand more about appearance CSS property
I hope this helps.
答案2
得分: 1
使用这段代码
<!-- 开始代码段: js 隐藏: false 控制台: true Babel: false -->
<!-- 语言: lang-css -->
input[type=number]::-webkit-outer-spin-button,
input[type=number]::-webkit-inner-spin-button {
-webkit-appearance: none;
}
input[type=number] {
-moz-appearance:textfield;
}
<!-- 语言: lang-html -->
<input type="number" />
<!-- 结束代码段 -->
英文:
use this code
<!-- begin snippet: js hide: false console: true babel: false -->
<!-- language: lang-css -->
input[type=number]::-webkit-outer-spin-button,
input[type=number]::-webkit-inner-spin-button {
-webkit-appearance: none;
}
input[type=number] {
-moz-appearance:textfield;
}
<!-- language: lang-html -->
<input type="number" />
<!-- end snippet -->
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论