margin-top越界以及所有子元素浮动后父元素高度为0且影响后续元素的问题。

初学html时写CSS样式时总会遇到第一个子元素的margin-top越界以及所有子元素浮动后父元素高度为0且影响后续元素的问题。对于第一个子元素的margin-top越界问题当初是采用为该子元素的父元素设置border-top或者margin-top，但是今天老师教了另一个更完美的方法，那就是在父元素内生成一个空字符即让子元素不再是第一个子元素，且将其display设为table，代码如下：
parent:before{
content:” “;
display:table;
}
table显示样式既不是行内元素也不是块级元素，但其不允许和其他元素同在一行显示，且当其没有内容时高度为0，不占空间。
同理也可以用内容生成和以table方式显示解决所有子元素浮动后父元素高度为o且影响后续元素的问题：
/在父元素后面生成空字符*/
parent:after{
content:” “;
display:table;
clear:both;
}
ps：第一次写，多多包涵