效果图：
代码：
<!doctype html> <html> <head> <meta charset="utf-8"> <title>皆容ie和google的弹出div层</title> <style> body{ font: 62.5% "Trebuchet MS", sans-serif; margin: 0px; padding:0px; } .ui-widget-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: #aaaaaa ; opacity: .3; filter: Alpha(Opacity=30); } .ui-widget-content{ position: absolute; width: 480px; height: 130px; left: 30%; top: 30%; padding: 10px; border: 1px solid #a6c9e2; background: #fcfdfd ; color: #222222; } </style> </head> <body> <div style="position: relative; 100%; height: 100%; overflow:hidden;"> <!-- 页面显示的内容 begin --> <table width="100%" height="620"> <tr><td>333333</td></tr> <tr><td>333333</td></tr> <tr><td>333333</td></tr> <tr><td>333333</td></tr> <tr><td>333333</td></tr> <tr><td>333333</td></tr> <tr><td>333333</td></tr> <tr><td>333333</td></tr> <tr><td>333333</td></tr> <tr><td>333333</td></tr> </table> <!-- 页面显示的内容 end --> <!-- ui-dialog 透明的的背景层--> <div class="ui-widget-overlay"></div> <!-- 弹出的层 --> <div class="ui-widget-content"> xxxxxxxxxxx </div> </div> </body> </html>
注意：如果上面代码没效果，请注意发现文档最上面的<!doctype html>的文档类型声明是否写了，有些html可以不写,但有时必须写