请问前端学习 CSS 有啥好的资料么

[janwarlen]

最近有点想整全栈开发，发现 js 学习还是比较容易上手，但是样式这个完全是盲人摸象 请问各位，你们在学习前端的时候，CSS 这块是咋学的？

[wu67]

扫一遍 大漠 的 图解 CSS3.
有个具体印象, 以后随用随查, 或者查 mdn 都行.

[Light3]

https://developer.mozilla.org/zh-CN/

看学什么程度了
没一点基础的话 就手册看一遍
找个网页 html+css 堆一个
再搞 vue 也好是别的也好 就好来了

[chengxy]

在每个分类上（布局、定位、颜色、文本、动画）常用的属性本来就不多，记不清楚可以去 MDN 查询用法。

[cydysm]

css 世界 张鑫旭
或者看他 blog

[dfkjgklfdjg]

刷完 CSS 基础之后，多写布局就好了，搞清楚布局和定位就基本够用了。
如果想要提升的话，多刷 [CodePen]( https://codepen.io/) 和 [CSS-tricks]( https://css-tricks.com/)，CSS 是一个比较吃经验和脑洞的东西。

[zackkson1991]

我建议可以: 在你的项目中使用 tailwindCSS, 然后看人家里面对应的 CSS 用法. 然后, 熟练之.

[LavaC]

css 学到会写基础页面就行了，定义 div 的属性宽、高、颜色、边框、圆角、伪元素之类的，布局再学个浮动、绝对布局、flex 和 grid ，知道有这么回事，具体什么参数看 mdn 就好。

[vivipure]

多写，多练。
博客: css-tricks 和 张鑫旭
书籍： 《深入解析 CSS 》和 《 CSS 世界》
基础入门的话可以看： https://web.dev/learn/css/
练习： 到 dribbble 找设计稿 然后用 css 大致实现。练多了就好了
这套组合拳打下来应该就够用了。

[enchilada2020]

真想好好学一遍 那就搭配着 MDN 看 CSS 权威指南…刚学完 CSS 那会感觉自己可神了 各种 hack 信手拈来（也没有
结果很多东西不常用全忘光了。。。现在调样式还是眉毛胡子一把抓 靠 好烦

[corcre]

学到会写基础页面+1, CSS 各种属性有点太多了, 反正我是记不过来, 我都是写完基础页面然后看看具体需要实现的效果再去查对应属性或者直接复制别人写好的...

[retrocode]

《 CSS 世界》主讲传统 css3 前的特性
《 CSS 新世界》主讲 css3 的新特性
工作先看《 CSS 世界》比较稳妥
学习先看《 CSS 新世界》追新特性不考虑兼容

[thinkershare]

先去学美术和设计配色，否则纯粹从技术上来说学了用处也不大。可能必须要学的只有布局，盒子模型，定位。其它动画，缓冲这些用到的时候再看看就好了。你都说要你要做全栈，注定不可能抠细节，否则 CSS 一门就会耗费你非常多精力，这个玩意要搞透彻也是很花费时间的。如果学 Style Object Model ，就更花费时间了。

[allinoneok]

这里 https://www.afterdo.com/notes/12

[dk7952638]

如果以后不想 all in 前端，直接 tailwind 吧

[janwarlen]

@thinkershare 是的，CSS 的技术和细节相当多（头皮发麻无法下手），目标定的能写基础的网页，先能够自娱自乐就行，有足够的经验和产品的想法再打算深入

[LavaC]

@LavaC 举个不恰当的对比，css 的使用体验很像选项被隐藏起来的 ps 。
比如我以前刚学的时候想给 div 加阴影，但是我不知道这个属性是什么，直接在编辑器输入阴影的单词“shadow”，编辑器就会候选一个"box-shadow"，这时候再在 mdn 看一下参数有什么，这个属性你就算学会了；字体同理，你输入一个 font ，自动候选出"font-weight"、"font-size"等属性，在你不知道某种效果该怎么加时，试试编辑器输入对应英文会很有帮助。

[thinkershare]

@janwarlen 其实只需要掌握一点，CSS 控制一个元素如何显示，所有关于显示的事情都可以交给它来处理。然后分块来处理，CSS3 是分块的，你可以一块一块的处理，按照能工作的程度去学习，我感觉最简单或者直接的是直接上 MDN ，然后发现某个 css rule 你无法完全理解透彻的时候，自己先实验(这个对于学习前端技术非常重要), 如果还是没理解就去搜索博客，如果还是不理解就去问答网站提问，最好还是不能理解的就去都 w3c 的规范文档。以前 css 大部分破事都是兼容性问题，现在其实好很多了，要感谢现在这个前端时代，Chrome 成为了 Web 事实上的标准。

[amber0317]

其实我也有这个疑问，CSS 怎么进阶呢？
自学前端，刷了一套课程，基本布局定位和简单样式都会做，能照着产品官网图抄一个差不多的出来，但经常看到别人分享的各种酷炫 CSS 效果，想学却感觉无从下手。只能硬读 MDN 吗

[chenzhao0121]

flex
position
grid
搜这三个关键字去学就行了。现在基本 flex 一把梭

[wisetc]

先把语法规则学会，然后抄一个网站的前端代码，比如 v2ex, 然后学学响应式布局，可以直接利用开源的 css 框架库