互联网---张鑫旭---读了张大大的好多博客了(自己小有心得) 怀着感恩的心来写

          刚开始写页面的时候，看见一边固定一边自适应老头大了，后来 百度了 找到了解决办法（第一次）在张大大的博客  感觉说的挺好 ，那时我只是为了解决问题走马观花的看了一遍，然后copy下来案例改改能用了也没注意什么，后来做页面我想左边固定，右边自适应其中多了一个线，中间的分割线的那个border线要1px solid

 #ccc显示 当时在想 该依据左边好呢还是右边好呢，年少的自己对自己的js自信满满就用js处理了，晚上回去想这个问题了，搜了下又偶遇张大大的dispaly：table-cell；布局！  ----------------------------------------这叫初出茅庐的我大开眼界！

                （--------------------见识了张大大的牛逼   然后就张住进了张大大的博客     每看一遍自己浮躁寂寞的心能沉淀一分 ）

       今天说说张大大里面的---------BFC（"Block Formartting context"）--字面意思理解就是 "块级格式化上下文"

   对其实也就是这个这个意思具体表现就是   BFC元素特性表现原则就是，内部子元素再怎么翻江倒海，翻云覆雨都不会影响外部的元素。所以，避免margin穿透啊，清除浮动什么的也好理解了。（张大大原文）我的理解：

      <div class="box">

                 <img  src="" alt="" class="left"/>

                <div class="right"></div>

    </div>

样式:

     <style>

             .box{border:5px solid #ccc;padding:5px;}

            .left{float:left;}

            .right{overflow:hidden;}

      </style>

     

    这就是我们说的自适应布局你现在估计还不理解吧   what  ！ what are you---干哈里 

   对重点来了

  1：   当.left 这个div高度没有.right这个div的高度高的时候，这时候我们用bfc非常的完美把左右分割开来按照我们想的在进行（当左边），我们也可以给.left这个div来点margin-right让他和.right有点间隔！看起来更舒服

　2:   什么属性可以触发.right和这个div来进行ＢＦＣ呢：　对就是他们：

　　　－－－上面样式里面的overflow：hidden；

           --------position值不是relative和static

           -------float值不为none的时候

           ------overflow的值为auto.scroll，hidden 


         ---------dispaly的值为table-cell，  table-caption ， inline-block