我有一个带有日期列表的表单,我使用 HTML 5 input type="date"
元素来表示它们。我想更改没有值的字段(即显示 dd/mm/yyyy
的字段)的颜色,以便更容易将它们与包含实际日期。
这可能吗?我认为 -webkit-input-placeholder
可能已经完成了我想要的,但似乎没有。
最佳答案
Chrome 中的日期输入中没有占位符。如果您在 devtools 的设置中选中“Show shadow DOM”,您将能够检查它:
<input type="date">
#document-fragment
<div dir="ltr" pseudo="-webkit-date-and-time-container">
<div pseudo="-webkit-datetime-edit">
<span aria-help="Day" aria-valuemax="31" aria-valuemin="1" pseudo="-webkit-datetime-edit-day-field" role="spinbutton">dd</span>
<div pseudo="-webkit-datetime-edit-text">/</div>
<span aria-help="Month" aria-valuemax="12" aria-valuemin="1" pseudo="-webkit-datetime-edit-month-field" role="spinbutton">mm</span>
<div pseudo="-webkit-datetime-edit-text">/</div>
<span aria-help="Year" aria-valuemax="275760" aria-valuemin="1" pseudo="-webkit-datetime-edit-year-field" role="spinbutton">yyyy</span></div>
<div></div>
<div pseudo="-webkit-calendar-picker-indicator"></div>
</div>
</input>
您可以使用伪元素设置单独元素的样式(适用于 Chrome Canary):
::-webkit-datetime-edit-year-field {
font-weight: bold;
}
关于css - 是否可以在 HTML5 输入类型 ="date"元素上设置默认占位符文本的样式?在 Chrome ?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14507119/