注意：我的容器div就像我想要的那样.它包裹着其他几个div.如果我调整this link建议的更改,我的容器div就搞砸了.我没有尝试让这个响应.它是一个固定的大小(想象一个图像),我只是希望它始终位于窗口的中心,无论窗口大小如何.
这就是我所拥有的：
* { margin: 0; padding: 0;}#container { background-color: black; border-radius: 10px; padding: 5px; display: block; margin: auto; /* changed to auto,dIDn't make a difference*/ border-wIDth: 1px; border-color: black; border-style: solID; position: absolute;}.light { height: 100px; wIDth: 100px; display: block; border-radius: 50%; margin: 10px; border-wIDth: 5px; background-color: grey;} <body> <div ID="container" onclick="changecolor()"> <div ID="green" ></div> <div ID="yellow" ></div> <div ID="red" ></div> </div></body>解决方法 也许它不适合你,因为容器是绝对的,因此身体的高度为零.
>首先添加高度：100％到HTML和body.
>使用转换到容器的绝对定位元素使用居中方法：
top: 50%;left: 50%;transform: translate(-50%,-50%);
请告诉我您对此的反馈.谢谢！
HTML,body { height: 100%;}* { margin: 0; padding: 0;}#container { background-color: black; border-radius: 10px; padding: 5px; display: block; margin: 0 auto; border-wIDth: 1px; border-color: black; border-style: solID; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);}.light { height: 100px; wIDth: 100px; display: block; border-radius: 50%; margin: 10px; border-wIDth: 5px; background-color: grey;} <body> <div ID="container" onclick="changecolor()"> <div ID="green" ></div> <div ID="yellow" ></div> <div ID="red" ></div> </div></body>总结
以上是内存溢出为你收集整理的HTML – 即使我更改窗口大小,如何将div放在页面中间？全部内容，希望文章能够帮你解决HTML – 即使我更改窗口大小,如何将div放在页面中间？所遇到的程序开发问题。
如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）