一个功能完整的现代化电商网站,采用纯 HTML、CSS 和 JavaScript 开发。
- 现代化渐变色彩设计
- 响应式布局,支持手机和桌面端
- 流畅的动画效果和交互体验
- 商品展示: 8个精选商品,包含详细信息
- 分类筛选: 6大商品分类(数码、时尚、家居、美妆、运动、图书)
- 购物车: 完整的购物车功能,支持增减数量
- 搜索功能: 实时搜索商品名称和描述
- 轮播广告: 自动轮播的促销横幅
- 点击商品卡片添加到购物车
- 购物车内可增减商品数量
- 自动计算购物车总价
- 点击分类卡片筛选对应商品
- 输入关键词实时筛选商品
- 侧边滑出式购物车界面
- 操作反馈消息通知
- 页面导航平滑过渡
- 鼠标悬浮视觉反馈
直接打开 ecommerce.html 文件即可在浏览器中预览。
python3 -m http.server 8080
npx serve .
docker build -t ecommerce-site .
docker run -d -p 8080:80 ecommerce-site
├── ecommerce.html # 主网站文件
├── Dockerfile # Docker 配置文件
└── README.md # 项目说明文档
- 前端: HTML5, CSS3, JavaScript (ES6+)
- 样式: CSS Grid, Flexbox, CSS 动画
- 部署: Docker + Nginx
- 响应式: 移动端适配
- 📱 数码电子 - 手机、平板、配件
- 👕 时尚服饰 - 男装、女装、配饰
- 🏠 家居生活 - 家具、装饰、用品
- 💄 美妆护肤 - 彩妆、护肤、香水
- ⚽ 运动户外 - 运动装备、户外用品
- 📚 图书文具 - 书籍、文具、办公
- 使用现代渐变色彩搭配
- 卡片式商品展示设计
- 平滑的动画过渡效果
- 直观的购物车交互
- 优雅的消息通知系统
- ✅ 初始版本发布
- ✅ 完整的电商功能实现
- ✅ 响应式设计适配
- ✅ Docker 部署支持
MIT License
boyuan0222
🌟 如果这个项目对您有帮助,请给一个星星!