百度前端技术学院(IFE)2018第五六课

零基础学院第五天和第六天http://ife.baidu.com/course/detail/id/40codehttps://github.com/iCycloid/IFE2018/tree/master/4and5预览效果https://icycloid.github.io/IFE2018/4and5/resume.html 盒模型的概念给元素内容添加内边距、边界和外边距来布置单个元素的盒子inline、block和inline-block的概念块框（ block box）是定义为堆放在其他框上的框（例如：其内容会独占一行），而且可以设置它的宽高，之前所有对于框模型的应用适用于块框 （ block box）行内框（ inline box）与块框是相反的，它随着文档的文字（例如：它将会和周围的文字和其他行内元素出现在同一行，而且它的内容会像一段中的文字一样随着文字部分的流动而打乱），对行内盒设置宽高无效，设置padding, margin 和 border都会更新周围文字的位置，但是对于周围的的块框（ block box）不会有影响。行内块状框（inline-block box） 像是上述两种的集合：它不会重新另起一行但会像行内框（ inline box）一样随着周围文字而流动，而且他能够设置宽高，并且像块框一样保持了其块特性的完整性，它不会在段落行中断开。（在下面的示例中，行内块状框会放在第二行文本上，因为第一行没有足够的空间，并且不会突破两行。然而，如果没有足够的空间，行内框会在多条线上断裂，而它会失去一个框的形状。）默认状态下display属性值，块级元素display: block ，行内元素display: inline内外边距，宽度，高度，box-sizing等属性浮动，清除浮动clear: both;(待补充)如何使用浮动进行布局多列布局(liquid layout),固定宽度布局(fixed width layout)