码迷,mamicode.com
首页 > Web开发 > 详细

CSS中的三种常用定位

时间:2017-05-22 18:26:42      阅读:130      评论:0      收藏:0      [点我收藏+]

标签:abs   空间   body   code   div   absolute   固定   文档   元素定位   

一、相对定位(position:relative)

  如果想让一个元素在本来的位置进行一个位移,可以将该元素的定位设置为relative,同时指定相对位移(利用top,bottom,left,right).需要注意的是,元素仍然在文档流中,占据着它本来的位置空间.

二、绝对定位(position:absolute)

  想让一个元素在文档中的指定位置,可以使用absolute来定位,将该元素的position设置为absolute,同时使用top,bottom,left,right来定位.绝对定位的元素位置是相对于距离它最近的那个已定位的父级(相对/绝对)元素决定的.如果没有父级元素,则根据body来进行定位,与相对定位相反,绝对定位不占据空间,从文档流中删除.

三、固定定位(position:fixed)

  固定定位使用fixed属性,它会相对于整个文档定位,我们可以轻松的让一个元素定位在浏览器的左上,右上等方位.比如说想让一个div固定在右上方,使用以下代码

  .odiv{ position:fixed;  top:2%;  right:2%;}

  

CSS中的三种常用定位

标签:abs   空间   body   code   div   absolute   固定   文档   元素定位   

原文地址:http://www.cnblogs.com/lwwl/p/6890717.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!