程序员分享前端初学者入门学习顺序

现在的web前端非常的火，很多小伙伴想学习又找不到方法，也没有切入点，而且前端看起来简单其实复杂程度不低于任何一门后端语言，在不断接触和学习前端中很多初学者很难理清楚这个体系的结构，以下我们来了解下前端如何入门。

html和css学习

1、HTML常用标签

语言是什么 、Web前端开发语言、 HTML超文本标记语言 、 网页主体结构 、常用标签、超链接（a标签）、Img图片标签。

2、盒子模型

初探Div盒子模型 、css样式、 简单css样式、盒子模型Border边框讲解、盒子模型外边距盒子模型内边距、盒子模型占位计算、ul无序列表、ol有序列表、dl定义列表、补充知识（css）。

3、样式初始化及display+外边距合并

样式初始化、元素类型转换、 内联元素对于以下属性特殊化、块级元素和内联元素的具体应用控制元素水平方向居中、盒子模型外边距合并原则

如果你想学习前端可以来这个群，首先是二九一，中间是八五一，最后是一八九，里面可以学习和交流，也有资料下载。

4、元素选择符+背景

HTML命名规范 、 行业命名规范、 选择器初级 、background背景样式

5、css样式（Font+Text）+特殊符号

font字体样式、text文本样式、特殊符号、css样式查询表

6、选择器高级及a伪类

css选择器、a伪类

7、选择器高级应用&样式优先级 常用css3

选择器优先级、样式的多种形式 、样式优先级排序、常用css3

8、浮动

浮动概况、浮动的一般情况 、 浮动的特殊情况 、 浮动对文字的影响float浮动后的特征 和 inlink-block 特征对比、清除浮动、清除浮动的多种办法、min-width的运用

9、定位

position定位概况、static 、相对定位 relative、绝对定位 absolute、固定定位、z-index 层的位置关系

10、vertical-align img特征 cursor opacity

img特征、 vertical-align 垂直对齐方式、cursor指针样式、opacity透明度

11、表单

form表单 、form中的控件

12、表格

table表格结构 、table样式重置、table的默认特征、table单元格合并、display:table的特征

13、frameset框架

iframe内联框架、frameset框架集、frame子框架、自适应框架实例

最后给初学者一点建议：

1. 掌握HTML是网页的核心，是一种制作万维网页面的标准语言，是万维网浏览器使用的一种语言，它消除了不同计算机之间信息交流的障碍，因此，它是目前网络上应用最为广泛的语言，也是构成网页文档的主要语言，学好HTML是成为Web开发人员的基本条件。

2. 学好CSS学好CSS是网页外观的重要一点，CSS可以帮助把网页外观做得更加美观。