表单 / 13
日期选择 · 日历
单个日期、连续区间、具体时刻、月份年份、原生控件，以及一整块可嵌入的月历面板。日历的两种高亮（单点选中、区间覆盖）都在这里。
日期选择器
.dd + .cal-head / .cal-grid单日期 · 弹出式日历
区间选择 · 日历高亮
至
2026 年 10 月 · 已选 5 天
一
二
三
四
五
六
日
28
29
30
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
1
区间两端为实心反色，中间用浅色底铺满
时间 · 月份 · 年份
type=time / type=month / type=week时间选择
两个时间之间的差值为每日可服务时长。
月份与年份
日期时间与原生控件
跨时区协作时，先选时区再选时刻，避免歧义。
type=date 在移动端会唤起系统日历，是最省事的兜底方案。
完整月历
.cal / .cal-head / .cal-grid / .cal-dow
2026 年 10 月
一
二
三
四
五
六
日
28
29
30
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
1
10 月 3 日 日程
09:30
设计评审会
评审表单校验与日期选择的交互稿，产出 6 条修改意见。
13:00
组件库周会
同步 A 组 15 个页面的进度与阻塞项。
16:30
与客户对齐上线时间
确认 10 月 15 日 20:00 的灰度窗口。
20:00
发布检查
核对令牌变更、快照与回归用例。
共 4 项日程