您现在的位置是：网站首页> 编程资料编程资料
CSS简单实现网页悬浮效果（对联广告）_CSS教程_CSS_网页制作_
2021-09-10
12108人已围观
简介 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元素的绝对定位。
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">...
*{...}{
padding:0;
margin:0;
}
#fixedLayer{...}{
width:100px;
line-height:50px;
background:#FC6;
border:1pxsolid#F90;
position:fixed;
left:10px;
top:10px;
}
style>
head>
<body>
<divid="fixedLayer">固定不动div>
<p>ddp>
<p>ddp>
<p>ddp>
<p>ddp>
<p>ddp>
<p>ddp>
<p>ddp>
<p>ddp>
<p>ddp>
<p>ddp>
提示：
本文由神整理自网络，如有侵权请联系本站删除！
本站声明：
1、本站所有资源均来源于互联网，不保证100%完整、不提供任何技术支持；
2、本站所发布的文章以及附件仅限用于学习和研究目的;不得将用于商业或者非法用途；否则由此产生的法律后果，本站概不负责！
position:fixed; 以视口为包含块，因此在浏览器窗口内固定。
ie 6.0不支持，因此采用相对于html元素的绝对定位。
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">...
*{...}{
padding:0;margin:0;
}#fixedLayer{...}{width:100px;line-height:50px;background:#FC6;border:1pxsolid#F90;position:fixed;left:10px;top:10px;
}style>head><body><divid="fixedLayer">固定不动div><p>ddp><p>ddp><p>ddp><p>ddp><p>ddp><p>ddp><p>ddp><p>ddp><p>ddp><p>ddp>提示：
本文由神整理自网络，如有侵权请联系本站删除！
本站声明：
1、本站所有资源均来源于互联网，不保证100%完整、不提供任何技术支持；
2、本站所发布的文章以及附件仅限用于学习和研究目的;不得将用于商业或者非法用途；否则由此产生的法律后果，本站概不负责！
相关内容
- CSS教程：行高line-height属性(1)_CSS教程_CSS_网页制作_
- css制作有立体效果的表格_CSS教程_CSS_网页制作_
- HTML验证的好处？_CSS教程_CSS_网页制作_
- 英文教程：鼠标悬停（hover）效果_CSS教程_CSS_网页制作_
- dl,dt,dd标记在网页中要充分利用_CSS教程_CSS_网页制作_
- dl、dt、dd 标记来改造163邮箱的广告条_CSS教程_CSS_网页制作_
- CSS将成为网页设计师必备知识_CSS教程_CSS_网页制作_
- DIV CSS：网页一行两列背景自适应_Div+CSS教程_CSS_网页制作_
- CSS初学：如何修改Zblog中的CSS_CSS教程_CSS_网页制作_
- CSS关于初学者的问题_CSS教程_CSS_网页制作_
