7a5fb889c5392a75e26bee12c19e2ed70d8b3b3f
任务日历系统
一个简洁美观的任务日历系统,可以标记每一天的任务完成状态。
功能特性
- 📅 日历视图:清晰的月份日历展示
- ✅ 任务标记:支持三种状态
- ✓ 任务已完成(绿色)
- ○ 任务部分未完成(橙色)
- 未标记(灰色)
- 💾 数据保存:使用浏览器 localStorage 自动保存标记数据
- 🎨 简洁界面:现代化的 UI 设计,响应式布局
- 🖱️ 便捷操作:点击日期即可切换标记状态
使用方法
- 直接在浏览器中打开
index.html文件 - 点击日历上的日期来切换标记状态:
- 第一次点击:标记为"已完成"(✓)
- 第二次点击:标记为"部分完成"(○)
- 第三次点击:清除标记
- 使用左右箭头按钮切换月份
- 点击"今天"按钮快速回到当前月份
文件结构
timeline/
├── index.html # 主页面
├── style.css # 样式文件
├── app.js # 应用逻辑
└── README.md # 说明文档
技术说明
- 纯 HTML/CSS/JavaScript 实现,无需构建工具
- 使用 localStorage 保存数据,刷新页面后数据不会丢失
- 响应式设计,支持移动端和桌面端
浏览器兼容性
支持所有现代浏览器(Chrome、Firefox、Safari、Edge 等)
Description
Languages
JavaScript
73%
CSS
17.9%
HTML
7.2%
Dockerfile
1.2%
Shell
0.7%