2019-10-14

一、内联元素的盒模型

     内联元素不能设置宽高

     支持水平方向上的内外边距和边框，垂直方向都不怎么好使

二、display和visibility

     disolay:none;/*不占地*/

     visibility:hidden;/*占地*/

三、overflow

     visible

          /*默认值。内容不会被修剪，会呈现在元素框之外。*/

     hidden

          /*内容会被修剪，并且其余内容是不可见的*/

     scroll

          /*内容会被修剪，但是浏览器会显示滚动条以便查看其余的内容*/

     inherit

          /*规定应该从父元素继承 overflow 属性的值*/

四、文档流

    

    

a

    

    

五、浮动

     浮动使用float属性：

     none/*不浮动*/

     left/*向左浮动*/

     right/*向右浮动*/

     块级元素和行内元素都可以浮动，当一个行内元素浮动以后将会自动变为一 个块级元素

     浮动元素默认会变为块元素，即使设置display:inline以后其依然是个块元素

     当一个元素浮动以后，其下方的元素会上移。元素中的内容将会围绕在元素的周围

     浮动会使元素完全脱离文本流，也就是不再在文档中在占用位置

六、简单布局

     首先清除浏览器默认样式

     布局大体：

     （1）开头样式

     （2）主体样式

     （3）结尾样式