对于css中的position:relative;我始终搞不明白它是什么意思,有什么作用? 

对于position的其它几个属性,我都搞懂了

引用

static :  无特殊定位,对象遵循HTML定位规则 
absolute :  将对象从文档流中拖出,使用left,right,top,bottom等属性进行绝对定位。而其层叠通过z-index属性定义。此时对象不具有边距,但仍有补白和边框 
relative :  对象不可层叠,但将依据left,right,top,bottom等属性在正常文档流中偏移位置
fixed :  IE5.5及NS6尚不支持此属性 

对于文档中所说的几个属性,除了relative,其它的一试,就效果出来了,对于个relative,真是难理解。 

要说是相对定位嘛,也不是。 

对于页面中一个static的div#demo,我想让这个#demo里的一个div#sub相对于#demo定位在右上角的某个地方,应该是用这个position:relative这个吧,然后再加上top,right给限制一下。 
我理解得没有错吧? 

不过在现实开发中,我却常常 得不到预期的效果。我觉得应该是我对这个属性还没有理解透。现在我想完全掌握这个,就像position:absolute那样地掌握它,想怎么弄html元素就怎么弄HTML元素。 
请理解这一点的朋友们给讲讲,或者给点资料,链接之类 的也可以。

转载:http://www.iteye.com/problems/5997/

html页面定位的更多相关文章

  1. scroll 滚动到指定位置触发事件 and 点击一按钮/链接让页面定位在指定的位置

    scroll 滚动到指定位置触发事件:$(function(){ $(window).scroll(function() { var s =$(window).scrollTop(); if (s&g ...

  2. 《手把手教你》系列技巧篇(四十五)-java+ selenium自动化测试-web页面定位toast-上篇(详解教程)

    1.简介 在使用appium写app自动化的时候介绍toast的相关元素的定位,在Web UI测试过程中,也经常遇到一些toast,那么这个toast我们这边如何进行测试呢?今天宏哥就分两篇介绍一下. ...

  3. 《手把手教你》系列技巧篇(四十六)-java+ selenium自动化测试-web页面定位toast-下篇(详解教程)

    1.简介 终于经过宏哥的不懈努力,偶然发现了一个toast的web页面,所以直接就用这个页面来夯实一下,上一篇学过的知识-处理toast元素. 2.安居客 事先声明啊,宏哥没有收他们的广告费啊,纯粹是 ...

  4. 完善tab页面定位

    当我们用锚点定位到页面某个元素时,接下来按tab的话是想进入到目前元素( id="content")的下一个连接 <a href="#content"&g ...

  5. js实现手机页面定位

    <script type="text/javascript"> function Location() {}; Location.prototype.getLocati ...

  6. 微信7.0以后更新后H5页面定位不准确

    在有定位的页面,微信更新完7.0以后定位也不提醒说是否同意定位 然后定位都跑到几百公里以外的地方了,然后怎么百度都不知道是啥问题,后面问了前端说微信更了7.0以后好像HTTP的就不支持了,然后我就去百 ...

  7. ajax 页面请求后,jsp页面定位

    如下图所示.A,B两区域为不动区域,既不随着滚动条的滚动而移动.C区域为异步加载内容区域, 在C区域中,点击查询按钮,需要异步加载查询 结果.但是查询结果会很长,这样子,就需要向下滑动滚动条,用户体验 ...

  8. 获取页面定位元素left top

    1原生方法: 第一种方法,比较简单,就是直接通过obj.style.left和obj.style.top,但是有局限性,这种获取的方法只能获取到行内样式的left和top的属性值,不能获取到style ...

  9. css 页面定位position

    position的四个属性值 relative absolute fixed static 参看实例 <div id="parent">  <div id='su ...

随机推荐

  1. UWP 图片剪切旋转工具

    好久没撸随笔了,明天终于放假休息了..准备去进行信仰充值,看<魔兽>去(话说surface phone 好久出,让我这个做UWP的也充点信仰..) 先上下效果图: 在设计中,遇到一个问题, ...

  2. EXT.NET 使用总结(1)

    前言 从系统改版到现在,将近半年的时间,原本陌生的Ext.NET的UI框架,也慢慢的熟悉了.总的来说,这个UI框架还是很优秀的,但是也没有100%完美的产品(老系统使用easy ui其实也挺好的).趁 ...

  3. [leetcode] 题型整理之排列组合

    一般用dfs来做 最简单的一种: 17. Letter Combinations of a Phone Number Given a digit string, return all possible ...

  4. 提取LSA密码lsadump

    提取LSA密码lsadump   LSA是Windows系统本地安全认证的模块.它会存储用户登录其他系统和服务用户名和密码,如VPN网络连接.ADSL网络连接.FTP服务.Web服务.通过搜集这些信息 ...

  5. 关于action和category的认知区别

    在我的了解, action: intent 有一个或多个action,如果过滤规则中能够匹配到其中一个,是可以成功的 category: intent有一个或多个category,过滤规则需要满足对应 ...

  6. Android入门(十):界面的布局方式及其实际应用

    关于Android界面布局,网上已经有了很多非常不错的学习资料,在这里我也不班门弄斧了,推荐两篇我认为写的不错的教程,然后再重点讲一下几种布局方式的实际应用. 教程链接:①http://www.cnb ...

  7. svn 修改文件的二进制或文本标记

    在添加一个文件的时候,svn自动标记成了二进制文件.当时也没在意就提交了.结果修改了之后不能进行svn diff操作,说是二进制文件不能进行diff操作.在网上找了个方法,修改这个文件的标记属性,把这 ...

  8. H.264的优势和主要特点

    H.264,同时也是MPEG-4第十部分,是由ITU-T视频编码专家组(VCEG)和ISO/IEC动态图像专家组(MPEG)联合组成的联合视频组(JVT,Joint Video Team)提出的高度压 ...

  9. [Android] 升级了新的android studio之后 发生如下的报错,The following classes could not be instantiated:

    The following classes could not be instantiated:- android.support.v4.widget.DrawerLayout (Open Class ...

  10. 修改ie的默认值 为ie10

    <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE10" />