zoukankan html css js c++ java

DIV制作气泡对话框兼容IE6

 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 2 <html xmlns="http://www.w3.org/1999/xhtml">
 3 <head>
 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 5 <title>无标题文档</title>
 6 </head>
 7 <style type="text/css">
 8 .tl {
 9     width:300px;
10     height:50px;
11     text-align:center;
12     line-height:50px;
13     margin:0;
14     padding:0;
15     _overflow:hidden;
16 }
17 .tl {
18     background:url('tl.gif') top left no-repeat #ff8c45;
19 }
20 .tr {
21     background:url('tr.gif') top right no-repeat;
22 }
23 .bl {
24     background:url('bl.gif') bottom left no-repeat;
25 }
26 .br {
27     background:url('br.gif') bottom right no-repeat;
28 }
29 p {
30     margin:0;
31     padding: 15px 0px 0px 50px;
32     background: url('angle.gif') 40px 0 no-repeat;
33 }
34 </style>
35 <body>
36 <div class="tl">
37     <div class="tr">
38         <div class="br">
39             <div class="bl">
40                 <blockquote>床前明月光，疑是地上霜。</blockquote>
41             </div>
42         </div>
43     </div>
44 </div>
45 <p>李白</p>
46 </body>
47 </html>

用到的图片:

tl.gif

tr.gif

bl.gif

br.gif

angle.gif

效果图:

查看全文

相关阅读:
2017年总结
 计算机基础之进制转换详解
 随机总数字里面选取随机数字进行随机排序案例(JAVA实现)
XML学习入门
 位运算从入门到入狱第一弹----原创!
MYSQL数据库引擎区别详解
 时间戳
 数据库三大范式整理
 数组
 JS全选与不选、反选

原文地址：https://www.cnblogs.com/vincent_ds/p/2626998.html

DIV制作气泡对话框 兼容IE6

DIV制作气泡对话框兼容IE6