1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
 2 "http://www.w3.org/TR/xhtml1/TDT/xhtml1-strit.dtd">
 3 <html>
 4 <head>
 5 <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
 6 <title>CSS3凹凸字</title>
 7 <style type="text/css">
 8 body{
 9     background-color:#999;
10 }
11 p{
12 
13     font-size:40px;
14     text-align:center;
15 }
16 .p1
17 {    
18     margin:100px auto;
19     width:200px;
20     border:1px solid red;
21     text-shadow:1px 1px 1px black,-1px -1px 1px white;
22 }
23 .p2
24 {    
25     margin:0px auto;
26     width:200px;
27     border:1px solid blue;
28     text-shadow:1px 1px 1px white,-1px -1px 1px black;
29 }
30 </style>
31 </head>
32 <body>
33 <p class="p1">我是凸字</p>
34 <p class="p2">我是凹字</p>
35 
36 </body>
37 </html>
38 <script>
39 
40 </script>