CSS教程:定位属性Position


CSS中最常用的布局类属性,一个是Float(CSS浮动属性Float详解),另一个就是CSS定位属性Position。

1. position:static

所有元素的默认定位都是:position:static,这意味着元素没有被定位,而且在文档中出现在它应该在的位置。

一般来说,不用指定 position:static,除非想要覆盖之前设置的定位。

#div-1 {
 position:static;
}

2. position:relative

如果设定 position:relative,就可以使用 top,bottom,left 和 right 来相对于元素在文档中应该出现的位置来移动这个元素。【意思是元素实际上依然占据文档中的原有位置,只是视觉上相对于它在文档中的原有位置移动了】

#div-1 {
 position:relative;
 top:20px;
 left:-40px;
}

3. position:absolute

当指定 position:absolute 时,元素就脱离了文档【即在文档中已经不占据位置了】,可以准确的按照设置的 top,bottom,left 和 right 来定位了。

#div-1a {
 position:absolute;
 top:0;
 right:0;
 width:200px;
}



相关阅读:
如何删除多级目录
CSS Sprite操作:用CSS处理圆角
Apache服务器之JSP概述篇
解读乔布斯为何抨击Flash是“垂死技术”?
Linux操作系统中RPM命令参数的使用详解
php实现从ftp服务器上下载文件树到本地电脑的程序
用xmanager软件登陆linux的方法
ASP.NET中基类Page_Load方法后执行原因分析
C#教程:使用lambda表达式记录事件日志
CSS实现简单的图片防盗链代码
JavaScript高级程序设计 学习笔记 js高级技巧
JavaScript 5 新增 Array 方法实现介绍
Linux 操作系统软件安装总结
帝国ECMS教程:普通图文调用和文字调用
快速导航

Copyright © 2016 phpStudy | 皖ICP备18014864号-4