1、盒子模型
（1）内容区（content）：width设置内容区宽度，height设置内容区高度。
（2）内边距（padding）：纸盒子的内容区与边框之间的距离
（3）边框（border）
为元素设置边框必须指定三个样式：
border-width：边框的宽度 。如果指定了四个值，会分别设置给上 右 下 左；如果指定了三个值，设置给上 左右 下 ；如果两个值，设置给上下 左右。
border-color：边框的颜色 。 规则同（border-width）
border-style：边框的样式（none没有边框 solid实线 dotted点状边框 dashed虚线 dobble双线）
（4）外边距（margin）
1、 如果只指定，左外边距或右外边距的margin为auto则会将外边距设置为最大值；垂直设置为auto，则外边距默认为0。
2、垂直外边距的重叠：在网页中垂直方向的相邻外边距会发生外边距重叠，取外边距中的最大值。
2、溢出值（overflow）
子元素默认在父元素内容区，如果子元素的大小超过了父元素内容区，则超过的部分会在父元素以外的位置显示，超过的那那内容，称为溢出内容，（默认在父元素外边显示）
可选值： visible：默认值，不会对溢出部分做处理。
hidden：溢出的部分，会被修剪，不会显示。
scroll：会为父元素添加滚动条，通过滚动来查看完整内容（不论是否溢出，都会添加水平、垂直方向上的滚动条）
auto：会根据需求自动添加滚动条。
3、浮动（float）
（1） 块元素在文档流中默认垂直排列，如果希望块元素在页面中水平排列，可以是块元素脱离文档流。当为一个元素设置浮动之后，元素会立即脱离文档流，其下边的元素会立即向上移动，直到遇到父元素的边框或者其他浮动元素停止。如果浮动元素上边是一个没有浮动的元素，则不会超过块元素。浮动元素不会超过他的兄弟元素，最多一边齐。
可选值：none：默认值，元素默认在文档流中排列
left：元素会立即脱离文档流，向页面左侧浮动
right：元素会立即脱离文档流，向页面右侧浮动
（2）浮动的元素不会盖住文字，文字会环绕在浮动元素的周围
（3）块元素脱离文档流后，高度宽度都会被内容撑开，内联元素脱离文档流后，会变成块元素。
4、高度塌陷
在文档流中，父元素默认被子元素内容撑开，但是当子元素设置浮动时，导致父元素高度塌陷，由于父元素高度塌陷，父元素下的所有元素都会向上移动，导致页面布局混乱。
解决:根据W3C的标准，在页面中元素都有一个隐含属性叫做Block Formatting Context简称BFC，该属性可以设置打开或者关闭。当开启元素的BFC以后，元素会有以下特性：
1、父元素的垂直外边距不会和子元素重叠。
2、开启BFC的元素不会被浮动元素所覆盖
3、开启BFC的元素可以包含浮动的子元素
5、文本输入项
（1）密码输入项 <input type="password" name=" "/>
（2）单选按钮 <input type="radio" name=" " value=" " checked=" "/>
(3) 多选按钮 <input type="checkbox" name=" " value=" " checked=" "/>
(4) 下拉列表 <select name=" ">
<option value=" " selected=" ">北京</option>
<option>上海</option>
</select>
（5）文本上传项 <input type="file" name=" "/>
(6) 文本输入域 <textarea name=" "><textarea>
（7）提交按钮 <input type="submit" value=" "/>
(8)普通按钮 <input type="button" value=" "/>
(9)重置按钮<input type="reset" value=" "/>
(10)隐藏项<input type="hidden" name=" "/>