前端样式有没有什么快速学习方式啊

[HuskyHao]

在开水厂实习做前端，这两天跟后端对接口啥的都能很快弄好，但是样式今天改了一天也没啥进展，咋做都丑丑的，要不就是不听话，用 curosr 改也改的怪怪的。想问下大伙有没有什么速成的技巧？能为小弟指点一二 /(ㄒoㄒ)/~~

[xianyu191031]

无他 写上一两年你就熟了

[IceBay]

我自己是会上 Dribbble 搜一下可以参考的设计

[lovedebug]

推荐两个文档 https://web.dev/learn/css 和 https://plainvanillaweb.com/ 可以速成~

[jonnyzhu]

开水厂是什么厂？

[radishzz]

@jonnyzhu 烧开水的厂吧 [doge]

[HuskyHao]

@jonnyzhu 员工福利只有免费开水的厂

[HuskyHao]

@xianyu191031 还是只能菜就多练了 T_T

[HuskyHao]

@lovedebug 感谢🙇‍

[mumbler]

你不需要懂啊，用 readdy.ai 口述需求去设计界面，颜值很高，然后代码给 cursor 去整合后端接口就行了

千万不要把时间浪费在学习回字有四种写法上

[hmxxmh]

以前我还认为学，现在真没必要了，交给 ai ，你负责找样式截图提供给 ai 。可以去 htmlrev 里面看看，颜值都挺高的

[xiaoming1992]

样式找 UI

[meteora0tkvo]

熟练掌握 flex 布局，就能应对除动画以外其他场景了。再说前端写页面之前要先画出设计稿的，再不济用笔画个草图也好，凭空在脑子想页面样式再写出来本身就不合理

[flytsuki]

有 ui 手搓,没有 tailwindcss 一把梭

[gorvey]

你们这种流程就不合理，没有设计图怎么谈还原度

[XTTX]

真正丑的原因的是没有使用连贯的 UI 样式和组件。 成熟的 repo 用 tailwind.config 去设置样式，读取单一来源的 preset 或者是 css. 自己搞起来是挺复杂的， 可以学习一下 oss repo 类似 cal.com middayai supabase. 设计 token 都是以 package 方式让每个 apps 去使用。

cursor 还是 AI ， 让它照葫芦画瓢。 如果组件库完整， 一个页面全是用组件拼接起来的， 单独改一个颜色或者字体大小情况很少。

我的建议是认真研究一下 shadcn 的 monorepo. 国外大部分项目都是基于他的一些原理改出来的。

[lihai1911]

没有设计图吗？

[zhongs]

1 、层

[leaveeel]

有 ui 用 flex 、grid 、position ，Transition 。没 ui 用 ui 库什么都不用改

[2Broear]

https://csscoco.com/inspiration/

[andyskaura]

flex 一把梭哈