自DeepSeek火了以来，我相信大家都多多少少尝试让AI帮自己写一些网页小工具、小活动吧！

但你有没有发现：这些AI生成的网页，外形似乎都是差不多的风格，让人一眼就能看出是AI做的。

特别是这种靛蓝色的背景，更是经常见到。

今天就来给大家用通俗的语言科普一下，再说说怎么避免。

tailwindcss

AI为了快速给你写出网页，它用直接调用一些现成的网页样式、脚本，而这个“tailwindcss”就是很多AI喜欢用的。

它看着只引用了一个域名，其实在浏览器去访问它的时候，它会跳转到最新版的样式脚本中去。

简单给大家介绍一下它，为什么AI都喜欢用它？

tailwindcss和传统的前端框架不同，比如传统的BootStrap老牌框架，给每个组件定义了各自的一套样式，按钮、卡片，这些样式是不能混用的；而tailwindcss则是定义了N多样式，这些样式不限制组件，你可以在各个组件中自由使用这些样式。

因为它使用起来方便，所以早期很多AI都优先在使用它。

做出来的风格具有的共同点：圆角卡片、卡片阴影、圆角按钮、鼠标悬停上浮动画、Emoji表情。

即使现在很多AI在写网页时，不引用tailwindcss，还是会使用上面这些风格特点，AI认为这种就是“现代化、简洁风格”。

所以让你一眼就能看出哪些网页是AI做出来的。

巧妙避免

其实AI用上面所说的这种风格做出来的网页还挺好看的，但是难免审美疲劳。

我们可以通过“反向指令”和“具体细节”来生成更多不同样式的网页，特别是需要根据具体的使用场景来生成与之相对应网页风格。

禁止词（告诉AI不要用这些）：

- 圆角
- 阴影
- 白色卡片背景
- 渐变背景
- 悬停动画
- 光滑边框
- 浮动效果

用“反主流风格”的描述：

请用HTML设计一个像从旧笔记本里翻出来的手稿：
- 使用纯白纸张背景，无渐变
- 所有元素边缘为 0，无圆角
- 无阴影、无光晕
- 文字排版不整齐，行间距不一致
- 可添加墨水渍、划痕、涂改痕迹
- 整体像未完成的草稿，带着真实的手写感

不要用笼统的说法，要更加具体。我最怕听到朋友说：“你帮我做个PPT吧，别太复杂，简单大气就行！”

比如，我明确自己需要的网页像一张设计的图纸，那么就这么告诉AI：

请生成一个 HTML 博客页面，主题为《不坑老师的演示》。
要求：
- 整体风格必须是「建筑图纸」风格（参考 1960–1980 年代建筑手稿）
- 背景为白色或浅灰，带有细密网格线
- 字体使用等宽字体
- 所有元素为直线、直角，无圆角
- 用「铅笔线」风格画出边界框，边框粗细不一
- 效果：像一份被撕下的设计草图，充满理性与残缺之美

所以，到最后你会发现，和AI交互的最核心能力依然是：得清楚地表达自己需要的是什么。

不要去专门学提示词，学了你也记不住，相反你应该多想想：“我到底想要啥？”

- end -