<b>前言</b>
从此篇文章开始，我将跳进前端的大坑中，以此来作为纪念。希望各位路过的大神能够给小弟指点迷津，同时也希望能够和正在学习前端开发的各位伙伴一起并肩前行。
一、前端认知
- 前端是做什么的
说的高大上一点，前端就是做IT系统工程的，主要负责信息化系统的设计、建设，包括设备、系统、数据库、应用系统的建设。说简单一点，其实就是做网页的。 - 开发流程
每个公司都有自己的一套开发流程，但基本上大同小异，主要可以分为下面几个步骤。- 产品需求
产品需求都是需要经过市场调查的，然后由产品经理指定需求文档。需求文档制定好了之后就需要开第一次例会，去掉一些不合理的需求。接下来就是开始设计 UI 了。 - 项目设计
项目设计由视觉设计师设计项目界面以及交互设计师设计交互逻辑。当项目设计完成后，就会有各种PSD文件了。这时候一般就会开第二次例会了。主要是给前后端开发排工期的。 - 前后端开发
前端开发包括：HTML5、iOS、Android、Unity-3D 等。后端开发主要是给我们前端提供数据。 - 测试
通过测试后就可以上线运营了。
- 产品需求
二、前端开发的核心语言
-
HTML 『结构层』
超文本标记语言( hyper text markup language )- 超文本：包括文字、图片、视频、音频等，最重要的一点是可以包含超链接，使各个页面连接起来。
- 标记语言：当我们把特定的英文单词放入我们的标记当中，我们的标记具有了新的语义，而由具有特定语义的标记的规范，我们可以称之为标记语言。当我们将英语单词放入标记当中，这时候我们可以称之为“标签”。标签又分为 单标签 </> 和 双标签 <></> 。
- 基本结构
<!-- 文档头（类型）声明，代表的是 HTML 5 的标准，文档头声明 不是标签 --> <!DOCTYPE html> <html> <!-- head --> <!--里面包含绝大部分内容都是不可见的，里面的内容主要用于辅助页面的展示--> <head> <!-- title： 双标签 定义页面标题--> <title>页面标题</title> <!--meta：单标签，定义页面的元数据，属性：charset，针对搜索引擎和解析格式的属性--> <meta charset="uft-8" /> </head> <!--body--> <!--里面包含的绝大部分在页面中都是可见的，主要用于搭建 HTML 结构--> <body></body> </html>-
检查元素
CSS 『表现层』
层叠样式表( Cascading Style Sheets )-
CSS 的引入方式
CSS 的引入方式有三种，包括内联样式表、内部样式表以及外部样式表。
* 内联样式表
`<div style="width:100px;height:100px;background-color:red;"></div>`
* 内部样式表
```
<haed>
<title></title>
<meta charset="utf-8"/>
<style>
div{
width:100px;
height:100px;
background-color:red;
}
</style>
</head>
```
* 外部样式表
`<link rel="stylesheet" type="text/css" href="css/style.css">`
引入方式的优先级
内联 > 内部 和 外部，内部和外部谁生效。如果选择器优先级相同，谁后引入谁生效；如果选择器优先级不同，选择器优先级高的生效。-
CSS 选择器
选择器用在内部样式表或外部样式表中。
JavaScript 『行为层』
JavaScript 负责页面的交互，一开始不会用到 JS 编程，所以我们只需要把 HTML 和 CSS 的基础知识学习牢固就可以了！
三、小练习
这篇文章就到这里，小练习的代码已上传到我的GitHub上。
如果文章对你有所帮助，那么请您点一下❤
由于本人水平有限，如有错误，欢迎大家指正。如果你在操作过程中发现一些没有讲到的错误或者问题，欢迎在评论留言，一起探讨，共同学习进步！
