1 <!DOCTYPE html>
2 <html>
3 <head>
4 <meta charset="utf-8">
5 <title></title>
6 <style>
7 *{margin: 0;padding:0}
8 body,html{
9 width: 100%;
10 height: 100%;
11 background: url(‘cat-019.jpg‘);
12 background-position: center;
13 background-size: 100% 100%;
14 }
15 .box-wrap {
16 position: relative;
17 width: 900px;
18 height: 500px;
19 margin: 0 auto;
20 }
21 .box {
22 height: 100%;
23 background: url(‘cat-019.jpg‘);
24 background-position: center;
25 background-size: 100% 100%;
26 -webkit-filter: blur(3px);
27 -moz-filter: blur(3px);
28 -o-filter: blur(3px);
29 -ms-filter: blur(3px);
30 filter:blur(3px);
31 }
32 .box1{
33 position: absolute;
34 top: 50%;
35 left: 50%;
36 margin-top: -100px;
37 margin-left: -200px;
38 width:400px;
39 height:200px;
40 border-radius: 5px;
41 background: rgba(255, 255, 255, 0.5);
42
43 text-align: center;
44 line-height: 200px;
45 }
46 </style>
47 </head>
48 <body>
49 <div class="box-wrap">
50 <div class="box"></div>
51 <div class="box1">
52 <h1>Hello,world</h1>
53 </div>
54 </div>
55 </body>
56 </html>
时间： 2024-10-13 23:28:36