CSS的position:relative与position:absolute的区别

小鹰博客9年前网站制作810

position:absolute这个是绝对定位;它不会随着窗口大小变化,只是固定在一个特定的坐标轴上面;

比如:position:absolute;left:20px;top:80px; 这个容器始终位于距离浏览器左20px,距离浏览器上80px的这个位置。

position:relative 这是相对定位啊!和上面的相反,它可以随窗口大小变化。但大小仍然不会变。要是你设置成width:100%;height:100%;这样就会随着窗口变大变小。。。

比如:<div class="1"></div><div class="2"></div>

当1固定了位置。1的样式float:left;width:100px; height:800px;

2的样式为float:left; position:relative;margin-left:20px;width:50px;

2的位置在1的右边,距离120px

相关文章

target=_blank与target=_self的区别

这二者之间的区别并不在技术实现细节的差别。而在于他们的不同表现形式带给人不同的感受。如对于jsp,asp等动态网页。如果,页面内生成的内容过多,必然导致打开速度慢。而且,当多个栏目共用一个模板时,问题...

用了百度云加速之后网站出现广告

我用了百度云加速之后, 网站右下角出现广告而且还是百度联盟的广告,上网查了一下,有的说是电信运营商搞的鬼,不管是怎么样,真是坑。果断弃用!...

用CSS设置链接在新窗口打开

由于工作的需要,需要把某个页面下的所有a标签都设置为新开新窗口,即:<a href="XXX">增加target:<a href="XXX"...

去掉Zblog的tags后面的括号和数字

zblog默认tags列表显示每个tags的数量,不过个人觉得这没什么用,而且对SEO不友好,所以一定要去掉。操作之前建议先备份网站。在zblog的zb_system\FUNCTION目录下找到文件c...

zblog模板文件修改对照文件表

首页与列表页相关模板default.html 首页主模板文件catalog.html 列表页模板文件b_article-multi.html 摘要文章模板b_article-istop.html 置顶...

HTTP状态码200、301、304、404、502 HTTP状态码查询

如果某项请求发送到您的服务器要求显示您网站上的某个网页(例如,用户通过浏览器访问您的网页或搜索引擎抓取网页时),服务器将会返回 HTTP 状态码响应请求。此状态码提供关于请求状态的信息,告诉 搜索引擎...

发表评论    

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。