百度前端学院 第5，6天

百度前端学院作业

三种简历样式，源代码地址，第三种简历样式预览。

学院问题验证如下

1. 盒模型的概念？
   每个元素被表示一个框，包括内容，内边距，边框和外边距
2. inline、block和inline-block的概念？
   上面三种样式为display属性，inline意为行内框，对它设置宽高无效，它随着文档的文字（例如：它将会和周围的文字和其他行内元素出现在同一行，而且它的内容会像一段中的文字一样随着文字部分的流动而打乱）；block意为块框，它独占一行，可以设置宽高；inline-block意为它不会重新另起一行但会像行内框（ inline box）一样随着周围文字而流动，而且他能够设置宽高，并且像块框一样保持了其块特性的完整性，它不会在段落行中断开。总结下来就是inline为行内框，会分离，block行框，不会分离，inline-block行内框，不会分离。
3. 内外边距，宽度，高度，box-sizing等属性？
   padding内边距
   margin外边距
   width宽度
   height高度
   总结下来就是一个盒子的总宽度是它的width， padding-right，padding-left，border-right和border-left属性之和。
   box-sizing: border-box;
   意为另一个框模型，它的weight/height=padding+content+border,也就是说它的宽度和高度包括了内边距，边框和内容。
4. 浮动，清除浮动？
   清楚浮动涉及的方法较多，在此只写一种，待以后补充；
   clear:both/left/right
   意为清楚两边浮动，左边浮动和右边浮动。
   在此介绍一种

<div class="clearfix"></div>
 .clearfix {
  clear: both;
}

如果您没有一个可用的元素来清除您的浮动(比如我们的页脚)，在您想要清除的浮动之后添加一个看不见的“clearfix div”是非常有用的。
6. 如何使用浮动进行布局？
待补充

学习总结

今天的收获比较大，懂得了浮动的基本原理以及清楚浮动最基础的方法，待以后把清楚浮动的方法全都写下来。