分享程序员开发的那些事...
更新时间：2021-10-23 09:38:48
如果你想要那个内部div覆盖外部div的整个宽度和高度，将内部div的宽度和高度设置为100％，如下所示
If you want that inner div covers the whole width and height of your outer div, set width and height of your inner div to 100% like this
<div style="width:100%; height:100%"></div>
试试这个：
Try this:
<!DOCTYPE html>
<html>
<head>
<style>
#inner {
background-color: yellow;
position: absolute;
top:0;
bottom: 0;
left: 0;
right: 0;
margin: auto;
}
</style>
</head>
<body>
<div name="outer" id="outer">
<div name="inner" id="inner" style="width:250px; height:350px">
put your contents hereput your contents hereput your contents hereput your contents hereput your contents hereput your contents hereput your contents hereput your contents hereput your contents hereput your contents hereput your contents hereput your contents hereput your contents hereput your contents hereput your contents
put your contents here
</div>
</div>
</body>
</html>
至于添加响应性，请阅读我的文章le 从冷漠到响应式网页设计 [ ^ ]
>
如果我得到你要求的东西，你想要外部div填满整个窗口，内部div位于外部div的中心。
你可以试试像这个（在Chrome中测试）：
If I get what you are asking and you want the outer div to fill up the whole window and the inner div to be in the center of the outer div.
You could try something like this (Testing in Chrome):
/*css*/
html, body {
height:100%
}
.outer {
background-color: red;
height:100%;
}
.inner {
background-color: yellow;
position:relative;
top:50%;
width:50%;
transform:translateY(-50%);
margin: auto auto auto auto;
}
<!--html-->
<div name="outer" class="outer">
<div name="inner" class="inner">put your contents here ...</div>
</div>
您可以删除背景颜色，它们仅用于显示。
这是小提琴： http://jsfiddle.net/yPMVJ/71/ [ ^ ]
以下是垂直对齐技术的链接： http://zerosixthree.se/vertical-align-anything-with-只需3行-css / [ ^ ]