一、内联元素的盒模型

1.内联元素不能设置宽高,支持水平方向的内，外边距 边框，垂直方向的不太灵

二、display_visibility

1、能不能把一个内联元素变成一个块？

display可以修改一个元素的类型，可以把内联变成块，也可以把块变成内联

2、display:none是不会显示元素并且这个元素不会在网页中继续占有位置

display:inline;行内元素：既有行内特点又有块的特点，就是既支持宽高又不会独占一行

display:block;块

display:block;块

visibility和display:none有什么区别？

visibility:hidden;/*虽然在页面中不显示了，但是还会在网页中占地

display-none;不占地

3、overflow

visible

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

hidden

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

可以解决内边距重叠的问题

scroll

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

inherit

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

4、文档流

<!--页面即文档-->

<div style= "background-color: #bfa; ">a</div>

<div style="height: 50px;"></div>

<div style="width: 100px; height: 100px; background-color: #ff0;"></div>

5、浮动

浮动使用float属性：

none/*不浮动*/

left/*向左浮动*/

right/*向右浮动*/

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

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

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

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

6、简单布局

首先清除浏览器默认样式

布局大体：

（1）开头样式

（2）主体样式

（3）结尾样式