从日期输入中隐藏箭头

Question

我试图从日期输入中隐藏额外的信息和箭头，但它没有隐藏在 Chrome 浏览器中，它确实隐藏在 IE 中。

我正在使用以下 CSS，但看不到任何错误。

input[type=date]:-webkit-datetime-edit,
input::-webkit-inner-spin-button,
input::-webkit-clear-button {
    display: none;
}

Answer 1

你可以试试这个：

input[type="date"]::-webkit-inner-spin-button,
input[type="date"]::-webkit-calendar-picker-indicator {
    display: none;
    -webkit-appearance: none;
}

或者您可以在 HTML 中包含一个类，例如 .remove--arrow，然后试试这个：

.remove--arrow {
    -webkit-appearance: none;
}
.remove--arrow::-webkit-inner-spin-button,
.remove--arrow::-webkit-calendar-picker-indicator {
    display: none;
    -webkit-appearance: none;
}