8.22学习笔记

div 

     padding   内边距

     设置padding的时候，这个元素的实际宽高会被拉伸

     实际宽高--设置的宽高+padding值（有两个）+border*2

     占有空间--设置的宽高+2*margin+2*padding+border*2

     

    pading  设置完之后，会无形拉大盒子。怎样解决这种效果。

 

     box-sizing  保证了 div 的宽高永远是设定的值，加了padding只会去挤空间。

     background    背景

         background：red；背景带红色。

           简写

   大小需要单独列出来

定位  position

     相对定位 position：relative； 这个属性给需要定位的父级。

     绝对定位 position：absoluet； 他有四个值  top left right bottom

     position 的使用其实是将该标签的类型给变了。讲块级变成了行级块。

页面结构分析

     结构层

            最外面一层的，这个机构不能设置太多的样式，一般设置宽，margin。

            千万不要设置position，会让内部元素脱离文档流。

     布局层

             给予内部元素进行排版的。

    position 造成的脱离文档流怎么解决？