【源码】基于 HTML 和 CSS 的云空调系统

项目简介

本项目是基于 HTML 和 CSS 构建的云空调系统，模拟了真实空调的功能与操作体验，让用户能在任何时间、地点“开启”空调。该系统无需实体设备，通过网页即可使用，具备便携、低功耗、操作简单等优势。

项目的主要特性和功能

主要特性

• 便携易用：可随时随地通过网页打开使用，无需安装实体空调。
• 低功耗：使用 HTML 和 CSS 绘制，相较于 Canvas 能耗更低。
• 噪音小：运行时几乎无噪音。
• 安装便捷：能通过 iframe 快速嵌入到网站中。

功能

• 空调控制：支持开启、关闭空调，可调节温度范围在 16 - 31˚C。
• 音效模拟：具备按钮点击和空调运行的声音效果。
• 系统适配：能跟随系统的颜色方案切换亮暗模式。

安装使用步骤

安装

iframe 嵌入

在 HTML 文件中添加以下代码，即可在网站中嵌入空调系统： ```html

```

自行部署

Docker

部署时可使用以下环境变量进行配置自定义： - AC_NGINX_DOMAIN：指定域名 - AC_NGINX_PORT：指定监听端口

腾讯云

使用 腾讯云 Webify 一键部署。

使用

开发预览

在项目根目录下执行以下命令： bash yarn start 然后在浏览器中访问 http://localhost:3000/。

构建项目

在项目根目录下执行以下命令： bash yarn build 构建后的文件将生成在 ./build 目录中。

环境变量设置

复制 .env.example 文件并重命名为 .env，可以进行环境变量的配置，例如关闭广告： bash VITE_DISABLE_ADSENSE=true

下载地址

点击下载 【提取码: 4003】【解压密码: www.makuang.net】