1、若想上下DIV块之间距离，只需设定：在CSS里设置DIV标签各属性参数为0
div{margin:0;border:0;padding:0;}
这里就设置了DIV标签CSS属性相当于初始化了DIV标签CSS属性，这里设置margin外边距为0；边框border属性为0和内补白也为0；这样相当于就初始化了DIV之间距各属性距离为0，这样就不会造成DIV直接有一定的距离。
2、如果想上下两个DIV间有距离的话，只需设定div中的margin属性即可，本例中div属性对全局DIV块都适用，代码如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <style type="text/css"> <!--设置DIV块的边界为5px--> div{margin:5px;border:0;padding:0;} #Box1{ width:200px; height:72px; background-color:#666; } #Box2{ width:200px; height:72px; background-color:#F0F; } </style> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>让上下两个DIV块之间有一定距离或没有距离</title> </head> <body> <div id="Box1"></div> <div id="Box2"></div> </body> </html>
这里设置了DIV块的边界为5px，当有上下两个DIV块时，边界是重合的，按大的来，所以这里上下两个DIV块的距离是5px（只取其中大的边界值，此处全局设定都是5px）
效果图：
如不想全局设置DIV块之间的边界，可在各个DIV块之间进行单独设置margin。
原文地址：http://www.cnblogs.com/eczhou/archive/2012/03/04/2379727.html
相关推荐
"上下左右拖动改变`DIV`比例代码"就是解决此类需求的一个解决方案，它提供了两种不同的拖动方式：左右拖动和上下拖动。 1. 左右拖动`DIV`边框： 这种效果允许用户通过鼠标在`div`元素的左右边缘进行拖动，从而改变...
写在最前 ...如上图所示，我们需要将要实现此功能的页面划分为三个部分，左部、调整区、右部，分别对应css样式为left、resize、mid，然后将这三个div放在css样式为box的div中即可 实现代码-HTML部分
- `changeUp()`和`changeDown()`：这两个函数分别用于切换滚动方向。 - `Circle()`：核心逻辑处理函数，根据`goDown`的值调整`scrollTop`，实现上下滚动。 - `imgStop()`和`imgGo()`：用于控制定时器的暂停与恢复...
### CSS中的Padding与Margin属性详解...这两个属性在网页布局中扮演着至关重要的角色，合理利用它们可以让网页设计更加美观和高效。在未来的学习和实践中，希望各位能够灵活运用这两个属性，创造出更加优秀的前端作品。
网页设计与制作中，"DIV+CSS创建网页-盒子模型介绍"是一个至关重要的主题，它涉及到网页布局的基础理论。盒子模型是理解网页元素如何在页面上占据空间的关键概念。在这个模型中，每个HTML元素都被看作是一个具有内容...
"JS QQ客服左侧或者右侧DIV+CSS浮动"是一个实现此类功能的解决方案，它能够让QQ客服窗口在页面的左侧或右侧保持固定，随着用户滚动页面而上下移动，始终保持在视线范围内。这种设计既不干扰用户浏览主要内容，又能...
当内容`div`的滚动距离超过一定阈值时（即内容宽度超过容器宽度），表头将显示滚动条，否则隐藏滚动条。 `eventHandler`函数是一个通用的事件绑定函数，它兼容了不同的浏览器事件处理方式。这里用于监听内容`div`的...
其中，让一个`div`容器水平居中是常见的需求之一。本文将详细介绍两种常用的CSS技巧，帮助开发者更好地掌握这一技能。 #### 一、利用`margin:auto 0` 这种方法是最简单直观的实现方式，适用于大多数情况。具体做法...
`这两个属性分别指定了元素相对于右侧和底部边缘的距离。这里右偏移10px，底部偏移10px，意味着元素距离浏览器窗口的右边缘和底边缘各自有10个像素的距离。 此外，`width: 100px;`和`height: 100px;`定义了元素的...
接着，`setInterval()`是JavaScript的定时器函数，它接受两个参数：要执行的函数和执行间隔（以毫秒计）。在上下滚动公告栏中，`setInterval()`将定期调用`animate()`函数，实现周期性的滚动效果。为了确保内容循环...
`将在元素上创建两个内阴影，分别位于右下角和左上角。同时，通过调整这些值，可以改变阴影的方向和深度，甚至可以叠加多个阴影效果。 box-sizing属性是另一个CSS3的重要特性，它改变了元素的盒模型。`content-box`...
以上CSS代码设置了一个DIV的高度为60像素，行高也为60像素，这样其中的文字就会垂直居中。 然而，对于多行文字的垂直居中，单行文字的方法不再适用。在这种情况下，推荐使用table布局方法。这种方法涉及将一个表格...
- `text-indent`: 设置文本首行缩进，如`2em`表示两个字体高度。 3. **背景类** - `background-attachment`: 定义背景图是否固定，`fixed`表示固定，`scroll`表示滚动。 - `background`: 设置背景颜色、图片和...
通过计算这两个值的比例，可以得到理论上滚动条的高度。在上述代码中，还定义了滚动条的最大高度`scrMaxHeight`和最小高度`scrMinHeight`，以及默认的滚动位置`scrDefualtTop`。这些参数用于在初始化时设置滚动条的...
`font-family`属性定义字体系列，例子包括`"Courier New"`, `Courier`, `monospace`, `"Times New Roman"`, `Times`, `serif`, `Arial`, `Helvetica`, `sans-serif`, `Verdana`等，多个字体名称之间用逗号隔开，...
当 `touchstart` 触发后开始计时，若在一定时间内没有接收到 `touchend` 事件，则认为是长按操作。以下是如何实现长按事件： ```html <div @touchstart="handleTouchStart" @touchend="handleTouchEnd">长按我</...
line_height 属性表示行间距，line_height 大于或等于 div 高度时，文本上下居中对齐。 border 属性设置边框样式，边框属性值有 3 种：边框尺寸（像素）、边框类型和边框颜色（16 进制）。margin 属性用来设置外边...
在每次滚动时，通过获取`#div1`的`scrollHeight`和`scrollTop`属性来更新这两个变量的值。`scrollHeight`属性返回一个元素的总高度（包括内容、填充、滚动条等），而`scrollTop`属性则返回一个元素顶部滚动的距离。 ...
- 两个值：第一个值设为上和下，第二个值设为左和右。 - 三个值：第一个值设为上，第二个值设为右和左，第三个值设为下。 - 四个值：依次为上、右、下、左。 例如，`margin: 10px 20px`将设置上下边距为10px，左右...