感觉可以分为下列几个学习阶段。
HTML+CSS这两个应该是对初学者比较友好的了，html大概了解一些常用的标签，css的话看下各种选择器的写法，然后找个网站模仿着写一遍样式，基本上就有感觉了。之所以推荐这两个先学除了简单，还有成就感，写的东西直接以页面展示出来，这比很多大学以C教学，对着命令行打印一堆数据的体验要好很多。你甚至可以尝试着写一个静态网站来做一个自己的简历，展示到朋友圈。
学习资源的话，推荐两本书吧。
《Head First HTML and CSS》
Head First系列的书一直评价很高，这本书也是。但偶觉得其实没必要一来就学那么多，很多标签和属性你都记不住，更不用说css那么多属性了，很多从业多年的前端应该也只能记住其中的大部分吧。推荐的学习方法是Learn by doing.过程中遇到问题的话，学会用搜索引擎+MDN.
《CSS Secrets》
看完这本书你会感叹，原来CSS还可以这样写。
JavaScriptjs的话还是比较复杂的，很难短时间就掌握的很好，但你至少要搞懂一些基本的控制流语法，变量，常量，函数，类这些东西。至少做到你参考别人的代码能看懂别人大概在写啥。
小白可以看下这本GitBook上的书，基础的东西都有涉及，也不长。最多一个小时就能看完。https://www.gitbook.com/book/xinqiu/learn-javascript-cn/details
稍微有基础了，想深入学JavaScript这门语言的话，可以看下《Javascript权威指南》这本书。
但老实说，这本书虽然很好，但是不适合初学者看，偶看了一部分之后觉得纯看书籍的话还是太无聊了，不太适合自己，遂弃之。
相比之下，偶更推荐廖雪峰大神的《JavaScript教程》https://www.liaoxuefeng.com/wiki/001434446689867b27157e896e74d51a89c25cc8b43bdb3000，在网上就能看，前面很基础，然后后面开始飙车。大家可以选择性看，文中提到了很多初学者会遇到的坑，比如var that = this.这种小技巧。很多时候初学者会被这种问题困扰很久，有人指路会帮你节省很多时间。
之后你可以了解一些ES6的新语言特性，然后试着用React，Vue，Angular之类的框架来试试。
选择的话，感觉新手推荐Vue，封装的很好，有时会觉得就算不会js，跟着Vue的教程，也能开始写一些东西。React的话，个人感觉要稍微难点，写的感觉和原生的JavaScript要接近些。Angular没写过就不评价了。但这三个框架的很多思想其实有共同之处，学会一个，学另一个会简单很多。所以不必太过纠结。而且前端这个领域，技术更新很快，如果你想学一门一劳永逸的技术，那么前端很可能并不适合你。
PHP+Mysql这两个感觉是相互依赖的，写PHP不可避免的就要操作数据库。PHP偶写的也比较少，只用Phalapi写过一个小网站，但感觉整体写起来的感觉不是那么爽，但也有可能是偶打开的方式不对，数据库的话，php有别人封装好的ORM库可以对数据库进行操作，这使得你可以不会sql语法也能对数据库进行操作，实在需要用到sql的时候，可以查下文档，然后模仿着写。因为这方便了解的不多，就不瞎提建议了。
不过虽然php是世界上最好的语言，偶也建议你有机会试试python或者node.js。或许会打开新世界的大门。
以上这些内容如果自学的话没个至少需要一两年的时间，还无法保证能学会。培训大概需要5个月的时间。想全部掌握好以上只是，可以来千锋武汉IT培训机构系统全面学习一下。千锋全程面授模式教学，真实项目实战，可先来免费试听两周，实地亲身体验下！
1. 内联样式表的权值最高 1000 2. ID 选择器的权值为 100 3. Class 类选择器的权值为 10 4. HTML 标签选择器的权值为 1 CSS 优先级法则： A 选择器都有一个权值，权值越大越优先 B 当权值相等时，后出现的样式表设置要优于先出现的样式表设置 C 创作者的规则高于浏览者：即网页编写者设置的CSS 样式的优先权高于浏览器所设置的样式 D 继承的CSS 样式不如后来指定的CSS 样式 E 在同一组属性设置中标有“!important”规则的优先级最大 这是规定好的,自然不能打破
ID用于标识页面上的特定元素（比如站点导航），而且必须是唯一的。 ID也可以用来标识持久的结构性元素，例如主导航或内容区域。ID还可以用来标识一次性元素，例如某个链接或表单元素。一个ID只能应用于页面上的一个元素。
class同一个类名可以应用于页面上任意多个元素，因此类的功能强大的多。类非常适合表示内容的类型或其他相似的条目。
在实际开发中，要根据实际使用情况来决定是使用哪种样式。对于单一元素的在单一界面的展示样式可以推荐是用id来定位。多余多个界面公用，或者同一界面多个元素风格一致，样式统一使用class类要方便的多。
下面就是最简单的一个小例子：
展示效果：
用于来定义一类可以在同一个页面内重复利用的样式。 如比较常用的.clearfix（一般是用于清除浮动），或者自己定义的用于新闻列表的样式，详细的写好链接、列表、边框以及背景等属性，有些人还会习惯把一些常用的属性作为一个类。