Maison > Article > interface Web > div+css标准布局常见问题及解决办法_html/css_WEB-ITnose
div+css标准布局常见问题及解决办法_html/css_WEB-ITnose
- WBOYoriginal
- 2016-06-24 12:28:41850parcourir
CSS2.0盒模型层次平面示意图和3D示意图
3像素问题及解决办法
当使用float浮动容器后，在IE6下会产生3px的空隙，有意思的是右侧容器没设置高度时3px在右侧容器内部，当设定高度后又跑到容器的左侧了，所以对布局精度要求高的话，请参考例29、31的解决方法。
上边容器浮动后，下边的容器跟着浮动，造成页面错乱
如以上例子中的footer必须要单独占一行，但当sidebar浮动后，content的高度小于sidebar的高度时，footer也跟着浮动到sidebar右侧了，造成页面错乱。解决办法是在maincontent和footer之间插入一个容器，设置样式 clear:both; height:0; font-size: 1px; line-height: 0px;用clear:both清除，即可使页面正常。
当子元素浮动且未知高度时，怎么使父容器适应子元素的高度？
这种情况可在父窗口加上 overflow:auto;zoom:1;这两个样式属性，overflow:auto;是让父容器来自适应内部容器的高度，zoom:1;是为了兼容IE6而使用的CSS HACK。zoom:1;通不过W3C的验证，这也是遗憾的一点，幸好IE支持
Déclaration：
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn