css固定定位,即悬浮效果(例如对联广告),不用js,css中"position:fixed;"即可。
position:fixed; 以视口为包含块,因此在浏览器窗口内固定。
ie 6.0不支持,因此采用相对于html元素的绝对定位。
<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transiti
css固定定位,即悬浮效果(例如对联广告),不用js,css中"position:fixed;"即可。 position:fixed; 以视口为包含块,因此在浏览器窗口内固定。 ie 6.0不支持,因此采用相对于html元素的绝对定位。
2008101719173931277801.gif
<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <htmlxmlns="http://www.w3.org/1999/xhtml"> <head> <metahttp-equiv="Content-Type"content="text/html;charset=gb2312"/> <title>CSS固定定位</title> <styletype="text/css">... *{...}{
2008101719174021877806.gif
padding:0; margin:0;
2008101719174032877807.gif
} #fixedLayer{...}{ width:100px; line-height:50px; background:#FC6; border:1pxsolid#F90; position:fixed; left:10px; top:10px;
2008101719174042177808.gif
} </style> <!--[iflteIE6]> <styletype="text/css"> html{ height:100%; overflow:hidden; } body{ height:100%; overflow:auto; } #fixedLayer{ position:absolute; } </style> <![endif]--> </head>
<body> <divid="fixedLayer">固定不动</div> <p>dd</p> <p>dd</p> <p>dd</p> <p>dd</p> <p>dd</p> <p>dd</p> <p>dd</p> <p>dd</p> <p>dd</p> <p>dd</p> <p>dd</p> <p>dd</p> <p>dd</p> <p>dd</p> <p>dd</p> <p>dd</p> <p>dd</p> <p>dd</p> <p>dd</p> <p>dd</p> <p>dd</p> <p>dd</p> <p>dd</p> <p>dd</p> <p>dd</p> <p>dd</p> <p>dd</p> <p>dd</p> <p>dd</p> <p>dd</p> <p>dd</p> <p>dd</p> <p>dd</p> <p>dd</p> <p>dd</p> <p>dd</p> <p>dd</p> <p>dd</p> <p>dd</p> <p>dd</p> <p>dd</p> <p>dd</p> <p>dd</p> <p>dd</p> </body> </html>
|