后端程序员该如何学习前端？

[cuebyte]

作为后端程序员当然写过模板啦，对 HTML 的各个标签算得上熟悉。之前也有用 Node.js 做过几个项目, 所以对 Javascript 语言也不算陌生。

但是以前在 W3C 看过教程，对 CSS 一头雾水，对于各种定位浮动也是记不清。看 CSS 文件的时候觉得在读天书。

另外觉得最近前端领域变化太快，阮一峰老师就说了：

前端变化有多快？两年前，大家都用 Grunt 构建，去年用 Gulp + Browserify 构建，今年用 Webpack 构建，明年可能会使用纯 ES6 的构建工具。每变一次，前面的那些工具就全没用，都白学。要知道，这些工具每一个都是软件系统，单单 Grunt 就有 4 千个插件，然而全没用了。

所以在这个时候学习前端的话，面对众多的框架和流派该如何选择呢？

[ChiangDi]

css 确实感觉很难的样子。

[yangg]

css 只能多用多写经验

[cxbig]

CSS 找一个框架，先熟悉，再修改
1. 比方说用 bootstrap ，搭一个 blog ，前端加载 bootstrap 的 css 和 js 文件，根据文档添加适当的 class 。熟悉一下什么是 responsive ，什么是 grid ，什么是 component 。文档里的各种元素都用一用。
2. 下一步看看文档怎么自定义那些 style ，尝试改一改。改的过程中就可以开始了解 grunt ， gulp 之类的怎么用。怎么放 origin ，怎么放 dist ，什么是 watch 。

没人可以了解所有的插件，随便找几个热门的加载上，看看怎么用就好。想用得好，还是要扎扎实实多做练习。

[ljbha007]

我都是瞎写 用 chrome developer tools 各种尝试 久了就调出来经验了
不过现在我命名还是很糟糕 不能写得像那些高手那么工整、简洁 大概有 20%的 CSS 是多余的
但是只要给张图基本都可以做出来

[scarlex]

搞懂盒子模型
分清级块元素，内联元素
学会常用的布局方式
知道几个比较重要的 CSS 属性的特性： display, position, float 。推荐一篇文章： http://www.jianshu.com/p/3a18fcd9fcda

其他属性就要慢慢积累了。

阮老师提到的那些构建工具，入门的话其实挺推荐 gulp 的，因为你可以清楚知道整个构建过程中的每一个步骤。 webpack 我自己也在试验当中，感觉用起来没 gulp 舒服，可能是我姿势不对。

[FrankFang128]

CSS 怎么看都没用，做才能懂。
而且只能意会，不能言传。

[theFool]

css 看 w3.org 或者权威指南 [虽然不够新，但东西解释很清楚]

css3 也可以看 the book of css3

[theFool]

框架找个看得爽的，等你觉得不够用自然会找其他或者自己造。

[imink]

我就是后端开发，现在主要是业务需求偏向前端，就自学了不少前端。

最好是需求导向去学习，比如，要写一个自适应的 native app 样子的网页，就去学自适应有哪些办法。

要不然就是靠兴趣去学习，比如，想写个博客模板，就在原有的基础上，定制化。这里面肯定涉及到了对 CSS 核心的理解。

现在 mooc 这么火，各大在线教育网站上关于 css 的视频那么多，花时间看下就好了。

推荐几本书：
1. HTML5 与 CSS3 基础教程
2. CSS 权威指南

再者， V 站上搜索帖子，有很多新发现。

[thinker3]

css 可能适合文科生思维

[xxppxiaowei]

CSS 是玄学。 看 MDN 关于 CSS 看 webkit 关于各种定位的处理 直接看看源码 大概是怎么处理的。

[jiongxiaobu]

Css module 大法好