前端基础知识---CSS

1.盒模型宽度计算
答:IE浏览器默认盒模型为border-box,其余浏览器默认盒模型为content-box。元素的实际模型宽度和高度为offsetWidth和offsetHeight。border-box的offsetWidth = width,
content-box的offsetWidth = width + padding + border。
2.margin纵向重合问题
答:纵向排列的元素的margin-top和margin-bottom会重合,重合以后的值取其中的最大值。
解决方法:设置值时,仅设置margin-top或者margin-bottom;使用padding。
3.父子元素中子元素设置margin-top,父元素会往下掉对应margin-top的值的问题
答:⑴.给父元素添一个大儿子,这个大儿子必须table。浏览器

<div class="d2">       
     <table></table>     <!-- 这里多了页面结构也不太好 -->
     <div class="d3">  
</div>

⑵使用CSS3伪元素::before给父元素添加内容code

.d2::before{
     content:"";
     display:table;
}

4.margin负值问题
答:在默认定位的元素中设置margin-top和margin-left负值,元素向上,向左移动;设置margin-right负值,同级右侧元素向左移动,自身不受影响;设置margin-bottom负值,同级下方元素向上移动,自身不受影响。
在绝对定位的元素中设置top为0和margin-top为负值,元素向上移动;设置bottom为0和margin-bottom为负值,元素向下移动;设置left为0和margin-left为负值,元素向左移动;设置right为0和margin-right为负值,元素向右移动;table

相关文章
相关标签/搜索