近一个月每次放假都在写前端页面，有点折磨自己。Web 页面的样式是真的难调，尽管已经在依靠组件库 + TailwindCSS 和 GPT 帮忙了。
写完一个小东西，换了一种分辨率发现样子又变了，或者是切换成移动端发现又哪里歪了，想要适配不同的分辨率和屏幕大小真的不容易。又或者是发现一个样式不对劲，不知道怎么找到它（组件内部的，找起来有点麻烦，也不好全局覆盖），或者是找到了也不知道怎么调整。以后再也不想评价别人写的咋样了，因为自己写起来确实费劲。我确实得找点资料（书）去好好学学，但我很好奇大家都是怎么做的？
今天中午起床后，一下午又在画样式，在这个 PR，大家也不妨告诉我，是不是我学习方法有什么问题？
 | 1 zcf0508 Apr 5, 2023 via Android  1 你需要先做好设计，再开始写代码，特别是需要适应屏幕分辨率的，要按照断点设计多个版本。用 tailwind 是移动端优先的，所以先实现小屏再往大屏调整。 |
 | 2 liyang5945 Apr 5, 2023 先学习 css 的基本知识吧，文档流，盒模型，定位，flex 布局，学会这些东西就发现布局什么的都是小菜一叠，我当初是看一个培训机构的前端教学视频学的，css 的课程不多，快的话一两周就能学会 |
 | 3 CLMan Apr 5, 2023 5 前端包括设计和实现(开发)，虽然有全栈的概念，但是真正能精通前后端开发的少之又少，精通前后端开发而且精通设计的更是凤毛麟角。 应试教育使得很多人缺乏基本的审美细胞，这个没法补课了。 我也曾经焦虑过，因为练习 web 项目就要涉及前端，而前端部分往往让我心里交瘁。后来我就直接爬别人的网站，只练习后端部分。 Material Design,Ant Design 之类的库也能帮助非前端人员节省开发的脑细胞。 总之，专业的领域交给专业的人来做，别自己硬着头皮浪费大量精力去做，你也学不到什么。 |
 | 4 crysislinux Apr 5, 2023 via Android 要做的协调好看确实比较难。抄别人的最简单。 |
 | 5 jones2000 Apr 5, 2023 设计难， 实现就是一个体力活。 |
 | 6 levelworm Apr 5, 2023 别做这种事情了，专心做 CLI 的工具，专心做程序员要用的工具，这种面向普通人的东西还是交给其他人来弄。。。 |
 | 7 daweiba Apr 5, 2023 找个 UI 框架，改巴改巴 |
 | 8 Aloento Apr 5, 2023 设计... 我一般就是先想点子，然后高保真，然后实现，然后优化 |
| 9 Aloento Apr 5, 2023 然后，我超，原 |
 | 10 kongkx Apr 6, 2023 via iPhone 1 需要补点 css 相关的知识，响应式以及优先级机制，了解网页 layout 的特性。 看了一个 commit ，好像不少 !important ，跟“行内样式” ，这样很容易搞死自己。 |
 | 11 jeffw Apr 6, 2023 如果没要求，我现在只都做电脑版，手机平板的屏幕那么大，又不是不能用。。 |
 | 12 vsitebon Apr 6, 2023 1 虽然我可能不清楚 vue 的语法是怎么实现的，但是我看了一下可以改进的首先是，如果采用了 Tailwindcss 那么尽可能不要再单独将某一个样式放在 style 里面，而是通过控制 class 来控制，例如：“:body-style="{ padding: '1rem' }"” 这种 |
 | 13 superedlimited Apr 6, 2023 via iPhone 用 tailwindcss 的前提是比较熟练掌握 css 。你 css 还不熟，就靠什么 chat 狗屁通帮你写，还 tailwindcss ，r u fucking 搞笑的么？ |
 | 14 debuggerx Apr 6, 2023 2 响应式设计和实现本就不那么容易，别说跨专业来写的了，就是大公司的产品，真正能做好的也没几个，国内尤其严重，还自作聪明得整出各种“屏幕适配方案”的歪路把人带偏…… 想做好响应式，需要足够的理解和认知，再加上各种技巧和套路的积累，所以不光得掌握常见的布局和样式知识，还需要看一些成体系的设计语言指导，比如 MD 的文档： https://www.mdui.org/design/layout/responsive-ui.html MD 好不好看见仁见智，但是它最少是一套系统的有足够理论支持的设计语言，相反很多 xxxDesign 、xxxUI ，本质不过是一些方便开发的 UI 组件库而已。 其次就是多留意好的设计实现，学习那些思路和技巧。一般是国外的网站和应用出现的概率会高一点。 再贴几个刚查到的链接： https://www.invisionapp.com/inside-design/examples-responsive-web-design/ https://developer.mozilla.org/zh-CN/docs/Learn/CSS/CSS_layout/Responsive_Design https://web.dev/responsive-web-design-basics/ (我看还有几个大聪明说前端简单的[狗头]) |
 | 17 YouMoeYi Apr 7, 2023 某些人戾气不要太大 多分辨率多端 UI 的响应式设计本身就不那么好做 |
 | 18 js8510 Apr 7, 2023 1 做个 UI 真的很难。。开始时候独立还发还想着我要做好看，我要设计一下，我要响应尺寸变化。后来直接放弃，遵循能用就行的原则。 其实经过漫长的独立开发最终上线，多数情况是完全没有流量。如果成功了，UI 还有机会改。 |
Select Language