YL

FOOTER & SHELL

极简页脚Minimal Footer

一行搞定:左边 logo + 版权,右边几个关键链接。适合作品集、工具站、单页落地页。

效果预览

UI Set
文档示例定价社区
© 2026

适合用在哪

内容型站点、个人作品集、不想让页脚抢戏的营销页。

容易踩的坑

  • 链接用 9.5px 浅灰且行内间距过小,移动端触摸目标远小于 44px。
  • 极简到连隐私政策和联系方式都省掉,合规审查与用户求助都没入口。
  • 版权年份写死成旧年份,访客会怀疑站点已停止维护。

设计提示词 · Prompt

极简页脚(Minimal Footer):整条高度控制在 40-56px,左右两端对齐(flex + justify-content:space-between)。左侧是 logo(15px 圆角方块 + 10.5px 加粗名称);中间或右侧放 3-5 个链接(9.5px 中性灰,hover 变深);最右是 9px 浅灰版权信息。上下各留 12-16px 内边距即可。移动端把链接折叠为一行可横向滚动的次要导航,或直接只留版权。
Minimal Footer: keep the bar 40-56px tall, aligned to both ends (flex + justify-content:space-between). On the left, the logo (a 15px rounded square + a 10.5px bold name); in the middle or right, 3-5 links (9.5px neutral gray, darkening on hover); at the far right, 9px light-gray copyright text. 12-16px of vertical padding is enough. On mobile, collapse the links into a horizontally scrollable secondary nav row, or keep only the copyright.

常见搭配

同一页面里经常和「极简页脚」一起出现的模式,可以收藏后用「组合收藏为整页提示词」一起交给 AI。

演示 HTML 结构

<div class="sh-mini">
  <div class="sh-mini__l"><i></i>UI Set</div>
  <div class="sh-mini__nav"><span>文档</span><span>示例</span><span>定价</span><span>社区</span></div>
  <span class="sh-mini__cp">© 2026</span>
</div>

标签