Ecco un esempio (molto grezzo)
codice:
<body>
  <div id="contenuto">
    qui il contenuto del sito
  </div>
  <div id="opacizzato">
    <div>
      

contenuto della finestra modale</p>
    </div>
  </div>
</body>

CSS comune:
body {
  width: 100%;
  height: 100%;
  overflow: auto;
}

CSS standard:
#contenuto {
  position: absolute;
  top:0; left:0;
  ...
}
#opacizzato {
  display: none;
}

CSS in caso di finestra modale:
#contenuto {
  ...
}
#opacizzato {
  display: block;
  position: absolute;
  top:0; left:0;
  width: 100%;
  height: 100%;
  z-index: 20;
  background: url(semitrasp.png);   /* immagine di sfondo semitrasparente */
}
#opacizzato div {
  position: absolute;
  width: 300px;
  height: 200px;
  left: 50%;
  top: 50%;
  margin-left: -150px;       /* la meta` di width;  */
  margin-top: -100px;       /* la meta` di height */
}