- 论坛徽章:
- 0
|
|
兼容ie6浏览器窗口四角固定背景代码
昨天有网友提问“如何在html页面四角放置图片”，下面就是答案，供这位网友参考。-
- 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 <style type="text/css"> 7 html{ 8 _overflow:hidden;/*for ie6*/ 9 }10 body {11 margin:0;12 padding:0;13 _height:100%;/*for ie6*/14 _overflow:auto;/*for ie6*/15 }16 .mainbox {17 position:relative;18 _position:inherit;/*for ie6*/19 margin:20px;20 display:block;21 height:2000px;22 background:#e2e2e2;23 }24 .topleft, .topright, .bottomleft, .bottomright {25 position:fixed;26 width:100px;27 height:100px;28 background-color:#990;29 _position:absolute;/*for ie6*/30 _z-index:-1;/*for ie6*/31 }32 .topleft {33 left:0;34 top:0;35 }36 .topright {37 right:0;38 top:0;39 }40 .bottomleft {41 left:0;42 bottom:0;43 }44 .bottomright {45 right:0;46 bottom:0;47 }48 </style>49 </head>50 <body>51 <div class="topleft"></div>52 <div class="topright"></div>53 <div class="bottomleft"></div>54 <div class="bottomright"></div>55 <div class="mainbox">这里是内容区域填充文字</div>56 </body>57 </html>
- 复制代码
|
|
免费注册
发表于 2012-02-25 21:24
