Css 如何解决我的内容分区中的差距？_Css

Css 如何解决我的内容分区中的差距？

css

Css 如何解决我的内容分区中的差距？,css,Css,我有一个“内容分区”，里面有两个带有背景图像的分区（渐变和阴影）。现在我有一个问题，如果有很多内容，我必须调整我的“内容div”，但当我这样做时，我的div（顶部和底部div）之间会出现很大的差距。我知道我可以通过插入更大的图像来解决这个问题，但这对我来说是不可能的，因为每次内容div变大时，我都必须调整图像的大小。有什么办法可以解决这个问题吗？谢谢你的朋友！！！（尚未调整div的大小，因此看起来不错） BR/>调整了我的“内容DIV”，中间有一个缺口：（）此处的HTML代码： <

我有一个“内容分区”，里面有两个带有背景图像的分区（渐变和阴影）。现在我有一个问题，如果有很多内容，我必须调整我的“内容div”，但当我这样做时，我的div（顶部和底部div）之间会出现很大的差距。我知道我可以通过插入更大的图像来解决这个问题，但这对我来说是不可能的，因为每次内容div变大时，我都必须调整图像的大小。

有什么办法可以解决这个问题吗？谢谢你的朋友！！！

（尚未调整div的大小，因此看起来不错）
BR/>调整了我的“内容DIV”，中间有一个缺口：（

）此处的HTML代码：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2" />
<meta name="author" content="Dejan Peic"/>
<meta name="description" content=""/>
<meta name="keywords" content=""/>
<title></title>

</head>
<body>

<div class="mainwrap">
<div class="content">
<p><b>LESS CONTENT LOOKS OK!!!</p>
<div class="top">
</div>

<div class="bottom">
</div>
</div><!--/content-->
</div>
</body>
</html>

将背景图像分为三部分，而不是两部分：

<div id="top"></div>
<div id="middle"></div>
<div id="bottom"></div>

将所有内容放在中间代码> div <代码>中，然后给它一个垂直重复的背景图像（<代码>背景重复：重复-）。当内容量增加时，中<代码> div <代码>将变得更高，背景将垂直地重合以匹配，所以你永远不会有一个空隙。

你的高度（

top

和

bottom

）在较大的容器中加起来不会达到528px；但是，在较小的容器中加起来会达到428

如果有任何方法可以消除CSS中对定义高度的需求，您可能希望继续使用它，以帮助消除类似的怪癖。

1）您可以将容器设置为固定大小，并在容器内有一个垂直滚动条2）您可以为内容创建重复的背景3）您可以仅使用CSS在没有图像的情况下重新创建阴影，这是最好的方法

<div id="top"></div>
<div id="middle"></div>
<div id="bottom"></div>