HTML5日期選取器有任何樣式選項嗎？

日期選取器在HTML5中顯示了一個類似於日曆的彈出視窗。這與選擇月份和年份相同，同時還會增加日期。

示例：HTML日期選取器的樣式選項

您還可以自定義彈出視窗並新增背景顏色。您可以嘗試執行以下程式碼以新增HTML日期選取器的樣式選項−

::-webkit-datetime-edit { padding: 4 em; }
::-webkit-datetime-edit-fields-wrapper { background:blue; }
::-webkit-datetime-edit-text { padding: 0 0.5em; }

編輯月份、日期和年份欄位

以下內容是編輯月份、日期和年份欄位−

::-webkit-datetime-edit-month-field { color: white; }
::-webkit-datetime-edit-day-field { color: red; }
::-webkit-datetime-edit-year-field { color: red; }
::-webkit-calendar-picker-indicator { background:gray; }

喬治·約翰

更新於： 2023年11月22日

2K+ 瀏覽量

開啟你的 職業生涯

完成課程以獲得認證

開始學習