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+ 次觀看

開啟你的 職業生涯

透過完成課程取得認證資格

開始