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