即使将页面向上或向下滚动，也可以在屏幕中间居中放置一个“ div”？

position:absolute;

position:fixed;

position: absolute;

position: fixed;

position: fixed

<div id=\"message\">
  <div class=\"container\"><div class=\"text\">
    <h2>Warning</h2>
    <p>The message</p>
    <p class=\"close\"><a href=\"#\">Close Window</a></p>
  </div></div>
  <div class=\"bg\"></div>
</div>

<style type=\"text/css\">
html, body{ min-height: 100%; }
#message{ height: 100%; left: 0; position: fixed; top: 0; width: 100%; }
#message .container{ height: 60%; left: 50%; position: absolute; top: 50%; z-index: 10; width: 60%; }
#message .container .text{ background: #fff; height: 100%; left: -50%; position: absolute; top: -50%; width: 100%; }
#message .bg{ background: rgba(0,0,0,0.5); height: 100%; left: 0; position: absolute; top: 0; width: 100%; z-index: 9; }
</style>

<script type=\"text/javascript\">
jQuery(\'.close a, .bg\', \'#message\').on(\'click\', function(){
  jQuery(\'#message\').fadeOut();
  return false;
});
</script>

.PopupPanel
{
    border: solid 1px black;
    position: fixed;
    left: 50%;
    top: 50%;
    background-color: white;
    z-index: 100;
    height: 400px;
    margin-top: -200px;

    width: 600px;
    margin-left: -300px;
}