零基础入门前端要掌握哪些知识?

2021-3-23 前端达人

零基础如何快速入「]前端?这个问题往往是没有基础会遇到的，想要快速入「门前端开发，简单来说就是要把基础的知识点掌握熟练，然后由浅入深的去学习，在这里根据我过来的经验，为大家简单介绍一下零基础如何快速入门前端。

举个可能不太恰当的例子:前端就好比如盖房子，html就充当了房子结构这部分，也是房子的基础。css呢，就好比咱们房子的装修,墙面什么颜色，什么风格，什么地板等等，这些给房子改变风格,样式的就是css。而Java呢，就好比这个房子的功能，房子需要制冷吧，需要暖气吧，也需要上下水吧。这些功能性的就相当于是Java。

一、前端工具（dreamwear/sublime/Photoshop/SVN等）

二、零基础入门（HTML，CSS）

1、前端开发概况、代码入门

页面基本结构、文档声明、编码声明、css语法、style属性、link和style标签、id属性、基本样式、Border 、Background、 Font、盒模型、文本设置等等。

2、常用标签集合

header、article、aside、section、footer、nav、h1-h6、p、ul、ol、li、img、dl、dt、dd…绝对路径、相对路径、标签语义化、标签嵌套规范、SEO…

3、常用选择器&标签类型划分

d、class、类型选择、包含选择、群组选择、通配符、选择器优先级、标签样式初始化订制方案、超链接及伪类划分、标签类型划分及特性、inline、inline-block、block…

4、浮动进阶

浮动的作用、浮动的特性、文档流、浮动的各种问题、clear、BFC(块级格式化上下文)、触发BFC的条件、Haslayout、Haslayout的触发条件…

5、定位

relative相对定位、Absolute绝对定位、Absolute绝对定位、Fixed 固定定位、inherit 继承、static静态定位、默认值、zIndex层级问题、margin负值、透明度…

6、表格和表单

表格标签、表格样式重置、单元格合并、表单元素、表单相关的属性操作、表单默认样式初始…

7、兼容性问题处理

兼容性问题总结、浮动在IE6，7下的各种问题、表单在低版本IE的问题、处理低版本IE对新增标签的支持、CssHack、条件注释语句、PNG问题、透明度的问题、固定定位在IE低版本的处理方式…

8、整站进阶

样式规划、favicon、Css Sprite、Data URI、隐藏元素、测试工具使用、滑动门、等高布局、三列布局、未知宽高图片在容器内水平垂直居中、文本水平垂直居中、多行文本水平垂直居中…

9、css3入门

transition、属性选择器、nth-of-type、nth-child、backgroundSize、box-sizing、圆角，盒模型阴影、文字阴影、rgba、表单高级、H5表单新增属性、E:not(s)、E:target、E::selection、

10、移动端布局

测试环境Emulation、viewport、window.devicePixelRatio、物理分辨率、Media Queries、rem、window.screen、移动端布局相关问题、window.deviceorientationevent、横竖屏判断…

11、Animation和Transform

浏览器前缀、keyFrames、Animation调用、播放次数设置、动画偶数次调用顺序、Animation的问题、无缝滚动、动画播放|暂停、rotate旋转、deg、skew斜切、scale缩放、translate位移、transform-origin、transform的执行顺序问题…

12、Bootstrap前端开发框架

Html语法规范、CSS语法规范、Less 和 Sass 中的嵌套、class 命名、选择器、Normalize.css、栅格系统、排版、代码、响应式工具…