将div设置为可见时停止内容移动？

Question

我有一个隐藏的div，当单击单选按钮时会显示get，但是当我使div可见时，下面的段落被压下来，有没有什么方法可以让段落被按下，即使div被隐藏，这样它不会移动？这里是我的代码

HTML

<div id="container">Hello</div> 
<p>Click the button below to view content</p> 
<input type="radio" onclick="displayDiv()"> 

CSS

#container { 
    display: none; 
    color: #fff; 
    font-size: 30px; 
} 

的Javascript

function displayDiv() { 
    document.getElementById("container").style.display = "block"; 
} 

Answer 1

更改属性display通过visibility;它的目的是将div放置在页面上，但如果将其赋值为“hiden”，则将其隐藏。

见this

CSS：

#container { 
    visibility: hidden; 
} 

的JavaScript

function displayDiv() { 
    document.getElementById("container").style.visibility = "visible"; 
}