关于css:CSS

一.css布局

1.盒模型

/*如下代码，请问div1的offsetWidth是多大？*/<style>#div1{width:100px;padding:10px;border:1px solid #ccc;margin:10px;}</style><div id="div1"></div>/*答案：offsetWidth=width+padding+border=122px：*/

/*扩大：如果让offsetWidth=100px,该如何做？*/<style>#div1{width:100px;padding:10px;border:1px solid #ccc;margin:10px;box-sizing:border-box; /*设置盒模型*/}</style><div id="div1"></div>

2.margin纵向重叠问题

/*如下代码，AAA和BBB之间的间隔是多少？*/ <style>    p{      font-size: 16px;      line-height: 1;      margin-top: 10px;      margin-bottom: 15px;    }  </style>  <p>AAA</p>  <p></p>  <p></p>  <p></p>  <p>BBB</p>/*   答案：15px。   解释：相邻的margin-top和margin-bottom会产生重叠；        空白的<p></p>也会重叠。*/

3.margin负值问题

- margin-top和margin-left负值，元素向上、向左挪动；- margin-right负值，右侧元素挪动，本身不受影响；- margin-bottom负值，下方元素挪动，本身不受影响。

4.BFC的了解和利用
什么是BFC?r如何