128 lines
3.1 KiB
Markdown
128 lines
3.1 KiB
Markdown
# 仰望汽车全系车型展示网页
|
||
|
||
## 项目简介
|
||
|
||
这是一个专为比亚迪仰望汽车品牌打造的全系车型展示网页，采用简洁优雅的高级设计风格，展示仰望U8、U9、U7三款主力车型。设计避免了AI味过重的渐变蓝紫色，采用了更加高级的黑金配色方案。
|
||
|
||
## 车型信息
|
||
|
||
### 仰望U8 - 豪华越野SUV
|
||
- **定位**: 百万级新能源硬派越野车
|
||
- **价格**: ¥109.8万起
|
||
- **动力**: 1200马力
|
||
- **续航**: 180km纯电续航
|
||
- **特色**: 易四方技术、应急浮水、原地掉头、17+1种驾驶模式
|
||
- **涉水深度**: 1.4m
|
||
|
||
### 仰望U9 - 纯电性能超跑
|
||
- **定位**: 百万级纯电性能超跑
|
||
- **价格**: ¥168万起
|
||
- **动力**: 1300+马力
|
||
- **加速**: 2.9秒零百加速
|
||
- **特色**: 云辇-X系统、1200V超高压平台、跳舞模式、赛道版
|
||
|
||
### 仰望U7 - 旗舰豪华轿车
|
||
- **定位**: D级旗舰豪华轿车
|
||
- **价格**: ¥62.8-70.8万
|
||
- **动力**: 1306马力
|
||
- **续航**: 720km纯电续航
|
||
- **特色**: 云辇-Z技术、星环座舱、0.195Cd超低风阻、行政座椅
|
||
|
||
## 核心技术
|
||
|
||
1. **易四方**: 四电机独立驱动技术平台
|
||
2. **云辇系统**: 智能车身控制系统（云辇-P/X/Z）
|
||
3. **刀片电池**: 超级安全的磷酸铁锂电池
|
||
4. **天神之眼**: 高阶智能驾驶辅助系统
|
||
|
||
## 设计特色
|
||
|
||
### 配色方案
|
||
- **主色**: #0a0a0a (深黑)
|
||
- **辅色**: #1a1a1a (次深黑)
|
||
- **强调色**: #d4af37 (高级金)
|
||
- **银色**: #c0c0c0
|
||
- **文字**: 白色到灰色的渐变层次
|
||
|
||
### 设计元素
|
||
- 黑金配色营造奢华感
|
||
- 大字体和充足留白
|
||
- 流畅的滚动动画效果
|
||
- 响应式设计适配移动端
|
||
- 交互式悬停效果
|
||
- 数字动画展示性能数据
|
||
|
||
## 文件结构
|
||
|
||
```
|
||
yangwang_auto_showcase/
|
||
├── index.html # 主页面文件
|
||
├── styles.css # 样式文件
|
||
├── script.js # 交互脚本
|
||
└── README.md # 项目说明
|
||
```
|
||
|
||
## 功能特性
|
||
|
||
- ✅ 响应式设计，适配各种设备
|
||
- ✅ 平滑滚动导航
|
||
- ✅ 数字动画效果
|
||
- ✅ 图片悬停效果
|
||
- ✅ 移动端优化
|
||
- ✅ 键盘导航支持
|
||
- ✅ 性能优化（防抖、懒加载）
|
||
- ✅ 错误处理机制
|
||
|
||
## 浏览器兼容性
|
||
|
||
- Chrome 80+
|
||
- Firefox 75+
|
||
- Safari 13+
|
||
- Edge 80+
|
||
|
||
## 使用说明
|
||
|
||
1. 下载项目文件到本地
|
||
2. 直接在浏览器中打开 `index.html` 即可查看
|
||
3. 或者部署到任何静态网站托管服务
|
||
|
||
## 技术栈
|
||
|
||
- HTML5
|
||
- CSS3 (Grid, Flexbox, CSS Variables)
|
||
- Vanilla JavaScript (ES6+)
|
||
- Intersection Observer API
|
||
- CSS Animations
|
||
|
||
## 优化特性
|
||
|
||
- 图片懒加载
|
||
- 滚动事件防抖
|
||
- 渐进式动画
|
||
- 无障碍访问支持
|
||
- 移动端触摸优化
|
||
|
||
## 更新日志
|
||
|
||
### v1.0.0 (2025-10-25)
|
||
- 初始版本发布
|
||
- 完成三款车型展示
|
||
- 添加核心技术介绍
|
||
- 实现响应式设计
|
||
- 添加交互效果
|
||
|
||
## 注意事项
|
||
|
||
- 项目中使用的图片为占位图片，实际使用时需要替换为官方车型图片
|
||
- 价格和配置信息基于2025年最新数据，可能会有变动
|
||
- 建议在现代浏览器中查看以获得最佳体验
|
||
|
||
## 联系方式
|
||
|
||
- 客服热线: 400-039-6666
|
||
- 营业时间: 周一至周日 9:00-21:00
|
||
|
||
---
|
||
|
||
**仰望汽车** - 极致技术，仰望未来
|