从 0 到 1 普及前端知识 | 内容合集
前端应该怎么学？怎么快速将基础知识点应用到工作中？在大前端的今天很多程序员对框架使用的技巧可谓相当熟练，但是对基础却缺乏锻炼导致在工作中屡屡受挫。本文从 html、css、到 js 从基础开始逐步讲解，中间穿插在工作中的应用以及代码使用技巧。对前端新手起到学习促进的作用，对有基础的前端程序员起到复习回顾作用，希望文章能为前端学习者尽一份绵薄之力。
作者：前端史塔克
简介：为了对新手进行一定的普及，本文从浏览器内核及常用的 web 标准和 html 骨架 html 最简单的标签讲解，最常用的 chrome、ie 等浏览器使用了哪些技术的，web 标准分为哪三部分，认识它们能对你接下来的学习有哪些指导意义等进行说明。
作者：前端史塔克
简介：本文是进入到 html 真正基础的第一章，文章内容对 html 最常用也是最基础的表格进行说明，从最简单的表格的标签以及表格的行和单元格，在前端中表格怎么定义，表格中的标签怎么设置表格整体居中合并单元格，最常用的表头和正文以及注脚应该怎么写。
作者：前端史塔克
简介：这一章进入到了前端三部曲的第二个 css，本文对 css 进行了说明，为什么前端需要 css，为什么 css 在前端中扮演这重要的角色，以及怎么引入 css 样式分为哪几种。css 的书写顺序，养成良好的习惯是进入前端领域很好的开端。在 css 中分为哪几种选择器怎么使用开发工具等作为详细的说明。
作者：前端史塔克
简介：本文主要侧重与基础，对 css 简介的顺序进行了说明。以及最基础的 css 中的权重应该怎么计算，这些权重会影响页面的哪些布局等。工作中常用的伪类有哪些，哪些是块级元素和行内元素，这些元素有哪些特性。
作者：前端史塔克
简介：本文文章对 css 进入了深入的了解，也是说明了 css 在工作中最常用的技能点有哪些，对内边距和外边距做了详细的说明，以及对 css 中比较著名的外边距合并用图文混排的方式做了很详细的说明，在文章最后的扩展中也告诉了工作中常用的圆角写法等。
作者：前端史塔克
简介：该文是 css 中的第四章，文章对 css 内容又进一步进行深入说明，对 css 之前常用的 浮动技术进行说明，虽然现在都用 flex 布局对浮动不常用，但是作为前端人员，基础还是需要牢固和掌握，所以文章 float 口诀以及怎么浮动等详细讲解。
作者：前端史塔克
简介：先来说一说为什么要出现书写顺序这个问题，其实对于开发人员来说在学习的过程中一般是可以有那么点书写自由的空间的，但是进入职场就是多人协作了，所以养成一个良好的写作习惯是非常值得肯定和赞扬的，给被人带来舒适的同时也会给自己加分。所以正确的书写 css 顺序是进入职场中称为“正规前端人员”重要的一环。
作者：前端史塔克
简介：这一章基本上学习了 css 中定位的几种方式，包括定位在实际工作中常用的口诀等，除此之外还学习了 margin：0 auto 水平居中的效果、未来常用的 z-index 等层叠。还详细的阐述了样式的书写顺序到底能不能影响渲染性能等。
作者：前端史塔克
简介：这一章偏一点前端的性能讲解。首先对前端的隐藏对象进行了简介，然后对 css 中的交互效果进行了少量的说明，最后对前端中的老知识点：精灵图进行了阐述，进而说明到前端中的传输和性能的讲解，说明了 http1 和 http2 有什么传输上的区别等。
作者：前端史塔克
简介：这篇是一个全新的开始，这一讲我们就要开始 h5 和 c3 了，html 和 css 的基础篇我们都告一段落了。html 一共两篇，css 走过了 7 篇，如果基础不太熟悉的话，建议多看看 css 和 html 基础篇。这篇开始我们就要开始新的征程了，进入到 h5 和 c3 的环节了。现在工作中基本上对于 html/html5、css/css3 都是一个硬性的要求。所以接下来 h5 和 c3 的学习当中会在原本的基础上更上一层楼。期待全新的认知吧！
作者：前端史塔克
简介：转换（transform）是 css3 中具有颠覆意义性的特征之一，原来的 css 实现的都是一些平面的东西，限制在了平面上，而 css3 新增的转换和动画效果使得 css 的功能更加强大。可以实现元素的位移、旋转、缩放等效果。
作者：前端史塔克
简介：3D 在现在看来是十分普遍的存在，不管是应用到技术上来说还是应用到现实生活中的场景，都离不开 3D 效果的实现。在 c3 中也出现 3D 的效果。除此之外也说明了浏览器的私有前缀，这些也都是浏览器方面的基本常识等。
作者：前端史塔克
简介：这一讲中主要讲流式布局，对于流式布局来说其余的仅作了解，但是二倍图这个概念或者方法在未来的工作中时特别常用的。所以需要在编辑器中可以试一试，然后再手机中对比一倍图和二倍图是否清晰。除此之外，还额外学了，css3 中的 box-sizing 和 background-size 也需要好好复习
作者：前端史塔克
简介：flex 是 flexble Box 的缩写，意为“弹性布局”，用来为盒模型提供最大的灵活性，任何一个容器都可以指定为 flex 布局，值得一提的是在现在大部分的工作中用 flex 布局的占比是非常大的，基本上现在较为基础的页面都是使用的 flex 布局。
作者：前端史塔克
简介：这篇说的 rem 布局，也就是常说的媒体查询，常用于区分 pc 和 mobile 端内容。同时也是布局中的最后一篇内容了，sass 是 css 一种开发工具，提供了很多便利的写法，也很大的程度上节省了设计的时间，所以在现在的 css 中基本上用的都是 sass，不过在初级阶段不建议你直接入手 sass，还是从 css 一点一滴的学习，可以在 css 学的完全熟练之后再去学习 sass 的用法。
作者：前端史塔克
简介：这一篇我们就进入了前端中相当重要的一个知识点，也就是：JavaScript，通常称之为：js。也是前端中非常重要非常好玩的一环，在往后的工作中写业务逻辑都和 js 是密不可分的！所以基础一定要扎实。本文还对计算机的基础以及编程语言和标记语言等做了说明。
作者：前端史塔克
简介：这篇就来看看 js 中的运算符和流程控制的内容，慢慢的从基础就要开始深入到逻辑上的东西了。这些都是构成了未来工作当中不可或缺的一部分，也是刚毕业进入到公司最先了解公司业务的这一部分，打好基础对未来的工作中成长是非常迅速的。
作者：前端史塔克
简介：这次我们就来看看程序中也相当重要的一点：循环，在循环中你会发现一切重复的东西都需要简化，这也就是循环所做的事情。在往后的工作当中很好的利用循环会让你的代码看上去更简洁更高效，除此之外我们末尾还会说以下 js 命名规范的问题。
作者：前端史塔克
简介：这一篇中我们会围绕数组展开讨论，但是主体内容并不是数组，而是处理数组的一些逻辑能力。这些也是未来迈向工作中一些必不可少的能力。会运用到之前说到的循环、判断、表达式等内容，可以在之前先自己思考一些，能解开多少题。
作者：前端史塔克
简介：这一篇中我们主要将函数的概念和函数声明的几种方式，牵扯到的还有函数中的形参和实参传参的问题，除此之外我们还会说一说 最常用 return 的作用，以及函数中处理参数的 arguments 等。我们对文中的 js 代码进行了图文混合的详细说明。
作者：前端史塔克
简介：这篇中我们要说一下 js 中的作用域和预解析，对于正常思维考量，你一定会觉得这部分内容会有不解，特别是针对预解析的内容，但是没关系，你可以尝试的多了解了解 js 的发展历程等原因会发现语言的发展绕不开它本身当下的环境和所处时代等多种因素。
版权声明: 本文为 InfoQ 作者【前端史塔克】的原创文章。
原文链接:【http://xie.infoq.cn/article/3da93330ebd71cf5b594cbb66】。
本文遵守【CC-BY 4.0】协议，转载请保留原文出处及本版权声明。
还未添加个人签名 2019.09.04 加入
普及从学校到工作怎么快速转变，更高效学习前端知识及后续发展趋向，更好快速的融入到工作中 关注公号：前端史塔克
评论