DIV+CSS布局技术中的间距处理.docVIP

DIV+CSS布局技术中的间距处理 　　摘 要 作为网页的布局技术，DIV+CSS应该是现在最常用的一种。在DIV+CSS布局技术中，当我们对页面中各版块进行布局时，经常会涉及到各盒子之间的间距处理，盒子之间的间距设置的正确与合理性在很大程度上决定了页面的显示效果。 　　【关键词】DIV CSS 盒子 间距 margin padding 　　在DIV+CSS布局技术中，我们一般是将网页中的每个元素可以看成一个盒子，对于页面上的版块采用标记进行分块，然后利用CSS样式进行定位并设置各元素的显示效果。在使用这种布局方式时，就一定会涉及到各盒子之间的间距处理问题。 　　通常，与盒子之间的间距相关的有两个基本的CSS属性：margin属性和padding属性。margin属性用于设置盒子之间的外间距，padding属性用于设置盒子边框与里面所放置的内容的距离（通常称为内填充）。 　　1盒子之间的位置关系 　　在网页布局中，盒子的位置关系通常有三种：1.水平排列；2.垂直排列；3.嵌套包含。 　　2盒子之间的间距处理 　　2.1 水平排列的兄弟盒子 　　对于水平排列的兄弟盒子，它们之间的间距是由左边盒子的右marign 值（margin-right）+右边盒子的左magin（margin-left）值构成。 　　2.2 垂直排列的兄弟盒子 　　对于垂直排列的兄弟