# tt_official_vue_web

**Repository Path**: tt1996/tt_official_vue_web

## Basic Information

- **Project Name**: tt_official_vue_web
- **Description**: 企业官网
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 1
- **Forks**: 1
- **Created**: 2025-09-08
- **Last Updated**: 2025-12-20

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 科技公司官网

一个使用 Vue3 和 Webpack 构建的现代化科技公司官网，具有强烈的科技感设计和响应式布局。

## 技术栈

- **框架**: Vue3 (Composition API)
- **构建工具**: Webpack
- **路由**: Vue Router 4
- **样式**: Tailwind CSS
Tailwind CSS 是一款实用优先   （Utility-First）的 CSS 框架，核心目标是让开发者无需编写大量自定义 CSS，通过直接调用预定义的 “原子化工具类”，快速构建出符合设计需求的界面。
Tailwind 内置了数千个预定义的 “原子类”，覆盖了几乎所有 CSS 常用属性，命名规则直观易懂（通常由 “属性缩写 + 数值 / 关键词” 组成）。例如：
布局相关：pt-4（padding-top: 1rem）、mb-6（margin-bottom: 1.5rem）、flex（display: flex）、justify-center（justify-content: center）
- **动画**: CSS 动画

## 功能特性

- 响应式设计，适配移动端、平板和桌面端
- 现代化的科技感UI设计，深色主题配色方案
- 流畅的过渡动画和交互效果
- 完整的页面结构：首页、关于我们、服务、案例、联系我们
- 表单验证和提交反馈
- 项目筛选功能
- 性能优化（代码分割、懒加载）

## 项目结构

```
.
├── public/
│   └── index.html
├── src/
│   ├── assets/
│   │   └── css/
│   │       └── tailwind.css
│   ├── components/
│   │   ├── Navbar.vue
│   │   └── Footer.vue
│   ├── router/
│   │   └── index.js
│   ├── views/
│   │   ├── Home.vue
│   │   ├── About.vue
│   │   ├── Services.vue
│   │   ├── Portfolio.vue
│   │   └── Contact.vue
│   ├── App.vue
│   └── main.js
├── package.json
├── tailwind.config.js
├── postcss.config.js
└── webpack.config.js
```

## 安装和运行

1. 安装依赖：

```bash
npm install
```

2. 开发环境运行：

```bash
npm run dev
```

3. 构建生产版本：

```bash
npm run build
```

构建后的文件将输出到 `dist/` 目录。

## 开发指南

### 添加新页面

1. 在 `src/views/` 目录下创建新的 Vue 组件
2. 在 `src/router/index.js` 中添加路由配置
3. 在导航栏组件中添加导航链接（可选）

### 自定义样式

全局样式定义在 `src/assets/css/tailwind.css` 中，可以在这里添加自定义的 Tailwind CSS 类。

### 修改配色方案

配色方案在 `tailwind.config.js` 中定义，可以根据需要进行调整。

## 浏览器支持

- Chrome (最新2个版本)
- Firefox (最新2个版本)
- Safari (最新2个版本)
- Edge (最新2个版本)

## 许可证

MIT