前端具体内容的学习：
1、盒模型：
内容区（element）、边框（border）、内边距（内填充）（padding）、外边距（margin）；
扩展：利用border制作小三角形
内边距（内填充）padding 会撑大元素框的大小；
外边距（margin） 拉开元素与元素之间的距离；
存在问题：margin上下叠压问题；
解决技巧：可以将某一元素方向设置成预想值，margin叠压会取最大的margin值；
2、行内元素&块级元素：
（1）行内元素与块级元素直观上的区别：块级元素各占一行，垂直方向排列。块级元素只能从新行开始接着下一个断行；行内元素会在同一行上排列，水平排列；
（2）块级元素可以包含行内元素和块级元素。行内样式只能包含行内元素和文本；
（3）行内元素和块级元素属性的不同主要体现在盒模型属性上：行内元素设置width、height无效（可以设置line-heigth），margin上下无效，padding上下无效。
行内元素和块级元素之间的互相转化：display；
3、浮动 float left | right | none | inherit
定义：使元素脱离文档流，按照指定方向发生移动，遇到父级边界或者相邻的浮动元素停下来；
文档流：是指文档中可显示对象在排列时所占用的位置；
清除浮动：clear：left | right | both | none | inherit 元素的某个方向上不能有浮动元素；
清除浮动的几种常见方式：
（1）直接为父元素设置高度（优点：简单、代码少，好掌握；缺点：只适用于高度固定的布局；）
（2）在父元素结束标签之前添加额外的元素，设置clear:both的样式（优点：简单、兼容性也好；缺点：不利于代码语义化，后期维护成本大）
（3）使用CSS 的 after 伪元素；（优点：浏览器支持好，各大型网站中都有使用，缺点：代码多，要两句代码结合使用，才能让主流浏览器都支持）
注意：在使用伪元素清除浮动时，为了让IE6/IE7浏览器适用，要给clearfix的css添加一条zoom：1的样式，触发haslayout；
（4）使用css 的 overflow属性；（优点：浏览器支持好；缺点：不能和position配合使用，因为超出部分会被overflow：hidden隐藏，而且还会解析出空格；）
通过触发BFC方式，实现清除浮动（BFC(Block formatting context)直译为“块级格式化上下文”。是一个完全独立的渲染区域，计算BFC高度时，浮动元素也会参与计算）
4、定位 position （top、 right、 bottom、 left）
static 元素框正常生成。
relative 相对定位 （相对定位，相对自身原来位置，原有空间保留，不会被挤占。）
（1）不影响元素本身的特性；
（2）不使元素脱离文档流；
（3）如果没有定位偏移量，对元素本身没有任何影响；
（4）提升层级；
absolute 绝对定位 （绝对定位，相对最近父元素，原有空间不保留会被其他元素挤占。）
（1）使元素完全脱离文档流；
（2）使内嵌支持宽高；
（3）如果有定位父级，相对于定位父级发生偏移；如果没有定位父级，相对于document发生偏移；
（4）相对定位一般都是配合绝对定位元素使用；
（5）提升层级；
fixed 固定定位 （绝对定位，是相对于浏览器窗口来定位的，是固定的，不会跟着屏幕一起滚动）
5、CSS简单的选择器
*（通配符）、元素选择器、class选择器（类选择器）、ID选择器
6、CSS分组和嵌套选择器
分组选择器：同时为多个元素设置相同的样式；
嵌套选择器：通过多个选择器嵌套匹配元素；
7、CSS组合选择器
（1）后代选择器：用空格将2个选择器隔开，表示上下级关系；
（2）子元素选择器：用>将2个选择器隔开，表示父子关系；
（3）相邻兄弟选择器：用+将2个选择器隔开，可选择紧接在拎一元素后的元素，且二者有相同父元素；
（4）后续兄弟选择器：用~将2个选择器隔开，选取所有指定元素之后的相邻兄弟元素；
8、CSS 伪类
：hover ：设置鼠标滑过时的样式；
：link ：未访问过的链接；
：visited ：已访问过的链接；
：active : 已选中的链接；
：first-child 选择第一个子元素
9、table 表格
表格标签：
table 表格
thead 表头
tbody表格主体
tr 表格行
th 表头单元格
td 表格单元格
表格样式重置：
table{border-collapse:collapse;} 单元格间隙合并
th，td{padding:0;}重置单元格默认填充
colspan 属性规定单元格可横跨的列数 <td colspan="2"><td>
rowspan 属性规定单元格可横跨的行数 <td rowspan="2"><td>
10、表单/表单元素
form 表单
<input type="....." name="" value="" /> （type input的类型； name 表单名字；value 默认显示的内容/提交的内容 ）
text 文本框
password 密码
（ user_name 用户名 password 密码）
textarea 文本域
radio 单选
checkbox 多选
submit 提交
reset 重置
button 按钮
image 图片
file 上传
hidden 隐藏
11、javascript
用法：HTML的脚本必须位于<script></script>标签之间（可被放在<body>和<head>部分）
（1）行内 （2）script标签里面 （3）外部JS文件
JS的组成：
（1）ECMAScript
（2）DOM 文档对象模型 通过DOM节点的方法去操控或者处理页面内容
（3）BOM 浏览器对象 与浏览器进行交互的方法
12、DOM
DOM 节点 （节点树）
访问元素的方法
getelementById() 返回的结果会是指定ID名的元素
getelementsByTabName() 返回的结果会是一个集合
getelementsByClassName() 返回的结果会是一个集合
13、变量 常量/字面量
var （声明变量的关键词）
//小驼峰命名法
//num 变量 1 字面量/常量 = 赋值 == 等于
var num = 1；
（声明变量时，字符串类型需要加上单引号或者双引号，数值类型不用；如 var num = 1;//数值类型 var str = "this is text"//字符串类型， 变量的类型取决于赋值的类型）
14、事件与函数
浏览器事件（BOM）与用户事件
封装函数：function funcName(){ 执行代码块 }
匿名函数：obj.onClick = function(){ 执行代码块 }
触发事件，调用函数：obj.onClick = funcName；
15、输出：
（1）使用 window.alert() 弹出警告框。
（2）使用 document.write() 方法将内容写到 HTML 文档中。
（3）使用 innerHTML 写入到 HTML 元素。
（4）使用 console.log() 写入到浏览器的控制台。
16、style 样式属性 设置或者返回某个元素的样式；
1606
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
