设置层叠效果
文字显示在前，背景显示在后。
代码：
1 <html xmlns="http://www.w3.org/1999/xhtml"> 2 <head> 3 <title>设置层叠效果</title> 4 <style type="text/css"> 5 h2 { 6 7 font-family:黑体; 8 9 font-size:16pt 10 11 } 12 13 .lowdiv { 14 15 position: absolute; 16 17 top: 55pt; 18 19 left: 230pt; 20 21 z-index:1 22 23 } 24 25 .place { 26 27 font-size:11pt; 28 29 color:#CC0000; 30 31 text-indent:20pt; 32 33 position: absolute; 34 35 top: 70pt; 36 37 left: 30pt; 38 39 z-index:2 40 41 } 42 43 44 </style> 45 </head> 46 <body > 47 <h2>蜻蜓的眼泪</h2> 48 49 <div class="lowdiv"><img src="../images/02.jpg" alt="蜻蜓的眼泪"></div> 50 51 <div class="place"> 52 53 男孩跟女孩是一对热恋中的恋人，很不幸的是女孩在一次体操比赛中倒下了，医生确诊为：白血病。男孩每天都陪在女孩的病床前，看着女孩那苍白僬悴的脸，男孩哭了，哭的很伤心，男孩每天晚上都在女孩的病床前，为女孩折上几只千纸鹤，就这样过了几个月，女孩已经奄奄一息了，一直昏迷着，男孩还是重复的为女孩折千纸鹤，男孩折到1000只整的时候，病房被照亮了，天使忽然出现在男孩面前，男孩被吓呆了，揉了揉哭肿了的眼睛，握着女孩的手，哭着对天使说，求你救救这个善良的姑娘吧，天使对男孩说，只要你愿意，为女孩做三年的蜻蜓，女孩会慢慢的好起来，男孩毫不犹豫的答应了，天使消失了，同时男孩也变成了一只蜻蜓。女孩果然慢慢的好起来了，女孩醒了，睁开眼睛却不见男孩的身影，病房里只有一直蜻蜓停留在病房的窗子上，起初几个月里女孩非常想念男孩，女孩自言自语的说，男孩一定变心了不在喜欢我了，于是女孩每天都对着窗子上的蜻蜓发呆，蜻蜓扇动着翅膀仿佛要对女孩说着什么。过了1年，时间冲淡了一切，女孩似乎忘记了男孩，跟照顾她的医生走在了一起，女孩决定跟医生马上就举行婚礼，婚礼的当天，蜻蜓也飞到了教堂的红地毯上，蜻蜓望着女孩健康的笑容，哭了，眼泪落在了红地毯上，这时候天使又出现在蜻蜓的面前，天使问蜻蜓：你后悔吗？蜻蜓流着眼泪对天使说，我不后悔，天使消失了，蜻蜓默默的为女孩祝福，漫漫的飞出教堂，消失在黄昏的地平线上。 <br/> 54 55 <img src="../images/02.jpg" width="110" align="right"> 56 57 </div> 58 59 60 </body> 61 </html>
效果：
