有没有写 css 样式的教学类内容

[mrgblues]

在学前端，发现样式看起来简单写起来难。

大佬们有没有类似那种可以学习写样式技巧，一个个案例去实现的学习课程， 或者其他推荐的 css 入门 /进阶方式。

[murmur]

样式很简单的，flex 布局起步，ie 兼容性才叫头大，写不好一般说明对页面布局拆分不到位，从大到小写，不要从小往大写，第一步考虑的是主布局，几分栏，哪里定哪里变宽

[Huelse]

https://css-tricks.com/guides/

[mrgblues]

@murmur 有在学 flex 布局，真的很方便。页面布局拆分真的是一门学问，所以想找些优秀的教程案例学习下.. 还有一些小技巧也需要积累下经验，之前不会弄消息的红点提示、还有背景内容的叠加之类的

[murmur]

不要上来学歪门邪道，现代 css 本质上是观察的技术，要掌握大局观，上来抠细节只会死的更快

比如 V2EX ，他的布局是什么样的，是不是上面一个顶栏下面内容区域，内容区域有侧栏，这里又怎么样，浏览器放大内容区域会放大么，侧栏和内容的比例如何，是全定死还是百分比还是活动，这样拆下去

[mrgblues]

@Huelse 谢谢，我看看

[golangLover]

https://www.w3schools.com/howto/

https://csslayout.io/

[mrgblues]

@murmur 好的，我要学会观察和思考！

[murmur]

@mrgblues 小技巧直接抄，可能你的需求打到 google 里别人有现成的，或者极端点图片搞定，红点那种就最简单绝对布局偏移出去，overflow 允许他出去显示就完了，现代 css 真的好方便，以前 ie8-年代圆角都没有，红点都得用图，或者更土，那个年代还在用各种闪光的 new 图片

[nanvon]

https://www.zhangxinxu.com/wordpress/ 张鑫旭的博客不错，每天都看几篇。他只关注 HTML 、CSS 、JavaScript

[molika]

不要去学要去写遇到问题就去搜索写多了就能接受了后面你写的速度就会越来越快

[alexad]

https://zh.learnlayout.com/

[TomatoYuyuko]

同意上面说的，布局拆分才是重点，拆分的好事半功倍，当然了这是经验活，你可以试着仿写一些大的门户网站的布局，写出布局就好不用填细节

[hgc81538]

http://www.csszengarden.com/
相同的 html, 套用不同 css 有不同風格, 直接 inspect dom 學習

[rongchuan]

建议看书，有些基础的内容不理解的话还是比较难受的。https://book.douban.com/subject/35021471/

[GeekJason]

https://www.youtube.com/c/CodingStartup

[mrgblues]

@golangLover 我看了下这个 https://csslayout.io/ 看起来很不错，点开了页面第一个 Accordion ，这个好像没有完整代码？只告诉你一些代码结构 /提示吗？

[mrgblues]

@GeekJason 这个我在 b 站关注了，讲得太棒了，我的 flex 和 css selector 就是看他视频学的。感谢

[mrgblues]

@rongchuan 不错的建议，找时间系统看一看。

[AyaseEri]

学 PS 作图有助于提升 css 姿势水平

[inhons]

https://web.dev/learn/css/