Html 调整窗口大小时调整div大小

我为一个站点构建了一个HTML/CSS页脚。但当我调整屏幕大小时，页脚不会调整大小，我只能看到一个剪裁过的页脚。我想调整页脚div的大小，以便可以随时查看所有文本。任何帮助都将不胜感激

/*页脚样式*/
#页脚背景{
位置：固定；
高度：30px；
左：0%；
底部：0%；
z指数：50；
宽度：100%；
背景：#000000；
不透明度：0.80；
}
#页脚框{
宽度：95%；
保证金：自动；
填充：0 10px；
}
#页脚框h2{
边际上限：0；
字体大小：20px；
文本对齐：居中；
线高：30px；
字体大小：正常；
字体系列：Arial，无衬线；
颜色：#A9A9；
}
#页脚框a{
文字装饰：无；
大纲：无；
颜色：#A9A9；
}
#页脚框a：悬停{
文字装饰：下划线；
}

|
|
|
|
|
|
|

正如@turnip所指出的，你的div有一个固定的高度，这意味着你看不到其余的物品，因为它们溢出了容器

尝试移除

高度：30px。为了获得足够宽的屏幕，您只需添加
marginbottom:0用于
h2
标记

P.S.考虑使用类而不是IDS来调整布局，它具有更少的特异性，被认为是一种很好的使用方式。
p.p.S.为什么您要使用
h2
作为链接列表，关于
ul
和
li
如何？
我想在这里说明一些问题：
（1） “高度”属性

在上面的代码中，您添加了高度：30px；也就是说，如果内容环绕，您将限制此元素的增长。您可以使用填充：20px；或者您想要的任何大小，以便当您缩小屏幕大小时，内容将包裹在元素内。
（2） h2具有预定义的css属性

#footer-box h2{
    margin-top: 0;
    font-size: 20px;
    text-align: center;
    line-height: 30px;
    font-weight: normal;
    font-family: Arial, sans-serif;
    color: #A9A9A9;
}

h2元素具有预定义的边距。不要只删除页边距顶部，而是尝试删除h2周围的页边距。i、 e边际：0；
我希望这将有助于您理解这一点。
基于上述人员的建议，我将答案粘贴在此处，以供其他希望看到有效解决方案的人参考


.footer框{
位置：固定；
字体系列：Arial，无衬线；
颜色：#FFFFFF；
背景色：#000000；
字体大小：11px；
宽度：100%；
不透明度：0.8；
z指数：50；
底部：0px；
左：0px；
}
.页脚框h2{
边际上限：0；
页边距底部：0；
字体大小：20px；
文本对齐：居中；
线高：30px；
字体大小：正常；
字体系列：Arial，无衬线；
颜色：#A9A9；
}
.页脚框a{
文字装饰：无；
大纲：无；
颜色：#A9A9；
}
.页脚框a：悬停{
文字装饰：下划线；
}

|
|
|
|
|
|
您需要删除固定高度（
高度：30px；
）。当文本换行时，该值不会神奇地调整其自身。在最新的chrome浏览器上，该值似乎正在调整大小。这是一个特定于浏览器的问题吗？@turnip-I将高度从30px修改为10%，效果良好。但是页脚的高度对我来说太高了，在底部留下了很多空白。然后我将其设置为5%，但这不适用于调整大小。我希望高度与文本高度相同，并在调整大小时进行调整。有什么建议吗？我是一个UI新手，所以这就是我想到的。但是我可以尝试ul和li作为下一步，并且让CSS使用类而不是id。我在最上面的评论中提到了将高度从px改为%，但这有它自己的问题。还有什么想法吗？我的答案已经包含了底部的额外空间，使用百分比值不能完全起作用。谢谢你的答案和解释。它可以将div的高度设置为%，h2的边距设置为0。
#footer-box h2{
    margin-top: 0;
    font-size: 20px;
    text-align: center;
    line-height: 30px;
    font-weight: normal;
    font-family: Arial, sans-serif;
    color: #A9A9A9;
}