自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 -