div+css=>遮罩+弹出框(固定在页面中间)

效果图

css代码

<style type="text/css" >body{     font-family: "Microsoft YaHei" ! important;}/*灰色遮罩层*/.fade{    width:100%;    height:100%;    background:rgba(0, 0, 0, 0.5);    position: fixed;    left: 0;    top: 0;    z-index: 99;}/*弹出层*/ .succ-pop{    width: 400px;    height: 300px;    background: #fff;    position: fixed;    left: 50%;    top: 50%;    margin-left: -200px;    margin-top: -150px;    z-index: 999;    border-radius: 5px;}   .succ-pop h3.title{    text-align: center;    font-size: 22px;    color: #ce002c;}</style>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33

html代码

<div class="fade"></div><div class="succ-pop">    <h3 class="title">        中间填写内容    </h3></div>
1
2
3
4
5
6