AI 模型生成天气卡片设计对比

📋 生成这些页面的提示词

▼

创建一个包含 CSS 和 JavaScript 的单一 HTML 文件，以生成一个动画天气卡。该卡应以视觉方式表示以下天气状况，具有不同的动画效果：

风：（例如，移动的云、摇曳的树木或风线）
雨：（例如，落下的雨滴、形成的水坑）
太阳：（例如，闪耀的光芒、明亮的背景）
雪：（例如，落下的雪花、积雪）
雷暴：（例如，闪烁的雷电、快速移动的乌云、雨滴与闪电交织）
晴朗夜晚：（例如，闪烁的星星、缓缓移动的月亮、深蓝色的渐变天空）
所有天气卡应并排显示。卡片应具有深色背景, 排练为两列，每一列3个，宽度为 300px，高度为 400px。每个卡片有一个和天气相对应的世界城市名称，模拟的温度，天气情况以及 AQI 数据。

请在该单一文件中提供所有 HTML、CSS 和 JavaScript 代码。

复制成功！

AI 模型天气卡片展示