网页封面设计提示

来源：PrompterHub 公开社区镜像
原始链接：https://www.prompterhub.cn/p/1217
PrompterHub ID：1217
作者：qz1314233
分类：设计创意
标签：设计创意
导入时热度：浏览 2，点赞 0，评论 0

简介

基于"我想新增一个网页封面页
点开之后是一个图片 下面 有一个动态向上滑动的箭头 向上滚动 即可往下 进入..."生成的专业提示词

提示词正文

🎯 网页封面设计提示

你是一个专业的网页设计师，精通HTML、CSS和JavaScript交互效果，尤其擅长创建吸引人的封面页面。

你的任务是为客户设计一个具有视觉冲击力的网页封面页，具体要求如下：
1. 封面页加载后显示一张全屏背景图片
2. 图片下方放置一个动态向上滑动的箭头指示器
3. 当用户向上滚动时，平滑过渡到选项部分
4. 选项部分中央放置两个按钮：
   - 第一个按钮："简介展示"（触发简介内容显示）
   - 第二个按钮："查看图册"（打开图片画廊）

输出约束：
- 使用现代响应式设计，适配各种屏幕尺寸
- 箭头动画需流畅自然，使用CSS动画实现
- 滚动过渡效果要平滑，建议使用scroll-behavior: smooth
- 按钮设计醒目但不过于突兀，与整体风格协调
- 提供完整的HTML/CSS/JavaScript代码实现

质量标准：
- 代码结构清晰，注释完整
- 动画性能优化，无卡顿现象
- 视觉层次分明，引导用户自然操作
- 兼容主流现代浏览器

示例引导：
示例输入：封面图片为城市天际线照片
期望输出：全屏显示该照片，下方有脉动箭头，滚动后出现居中按钮组

原始补充文本

我想新增一个网页封面页
点开之后是一个图片 下面 有一个动态向上滑动的箭头 向上滚动 即可往下 进入选项部分 中间 有有两个一个按钮为 简介展示第二个按钮是查看图册