写在前面的话：
关于前端的一些入门以及必备，下边是我的理解，如果有错误，不到位的地方请谅解、指出。
更新于 2017/11/07
前端基础技能：
一、HTML
二、css
三、js
必备技能：
git/svn的使用；
进阶技能：
面向对象编程；
入门学习资料：
w3c，菜鸟教程等；
坚持学习：
github，开源中国，牛人博客等，自行看书研究
更新于 2017/11/07 end
下边是一些零零碎碎的基础，写入自己入门时：
分为3个部分：
DOCTYPE / head / body
二、关于DOCTYPE:
之前是分了3种：1，严格：……strict.dtd
2.兼容：……transitional.dtd
3.……framset.dtd
严格可使得浏览器之间不兼容的情况少一些，更加规范~
HTML5的比较简单，就直接写<!DOCTYPE html>, 在sublime中，一个空白的html文档，按下 “！”,再按一下"tab"键，就可以看到上面的截图所示的代码了。
三、关于CSS引入：
CSS引入的四种方式：行内样式、内嵌样式、链接样式、导入样式
1.行内样式（不推荐）：最直接、最简单的一种，直接对HTML标签使用style=""，缺点：HTML页面不纯净，文件体积大，不利于蜘蛛爬行，后期维护不方便。
<p style="color:#F00; "></p>
2.内嵌样式（样式很少/页面很少时使用，一般是不推荐的）：将CSS代码写在<head></head>之间，并且用<style></style>进行声明
优缺点：页面使用公共CSS代码，也是每个页面都要定义的，如果一个网站有很多页面，每个文件都会变大，后期维护难度也大，如果文件很少，CSS代码也不多，这种样式还是很不错的。
<DOCTYPE ……>
<html>
<head>
<style>……</style> <!--css控制语句写在style标签中-->
</head>
<body>
<div>……</div>
</body>
</html>
3.链接样式：使用频率最高、最实用的样式：在<head></head>之间加上<link…/>
优缺点：实现了页面框架代码与表现CSS代码的完全分离，使得前期制作和后期维护都十分方便
<link type="text/css" rel="stylesheet" href="style.css" />
4.导入外部样式表（不推荐）：采用@import样式导入CSS样式表。HTML初始化时，会被导入到HTML或者CSS文件中，成为文件的一部分，类似第二种内嵌样式。
@import在html中使用：
<style type="text/css">
@import url(style.css);
</style>
@import在CSS中使用，如下：
@import url(style.css);
3与4的区别：link是在html加载前就使用，
import是在html加载后才引用；
四种CSS引入方式的优先级
1.就近原则
2.理论上：行内>内嵌>链接>导入
3.实际上：内嵌、链接、导入在同一个文件头部，谁离相应的代码近，谁的优先级高
css 优先级还与选择器有关，总之：关于css控制div的优先级问题：控制的范围越是精细，优先级别越高；
控制的范围包括的越广，优先级别越低；
5.CSS控制文字的一些基本属性的使用： 可以参考 w3c http://www.w3school.com.cn/cssref/index.asp
四、关于div布局
（1）block 与 inline，以及block-line ( 块状元素与内联元素，以及块状内联 )
常见的block 元素(用来布局占块的，表示标题、段落的都是这一类)：div , p
常见的inline 元素(用来填充内容，内容样式的都是这一类)：span, i
常见的inline-block 元素(这是比较特殊的一类)：img, input
1）问：block 与 inline，以及block-line的区别是啥？
答：就是字面上的意思……但最明显的区别是：block,inline-block都可以设置宽高，inline元素不行；
2）内联元素与块状元素的转化：用display ( 取值 block, inline-block, none, flex, box ……等超级多 )
内联转块状 display：block;
块状转内联 display：inline;
元素不显示(即隐藏) display:none;
（2）浮动：float（取值：left,right,none,inherit）
元素一旦是左浮或者右浮，就会脱离正常的文档流，若浮动元素的父元素没有给定高度，那么父元素将不会被撑开；
清除浮动使用 clear: left; clear: right; clear: both;
文章部分参照：http://www.cnblogs.com/seostyle/p/4951460.html