2.详细展示

2.1 position:absolute

2.2.1 说明:

绝对定位;脱离文档流的布局,遗留下来的空间由后面的元素填充。定位的起始位置为最近的父元素(postion不为static),否则为Body文档本身。

2.2.2 视图:

2.2 position:relative

2.2.1 说明

相对定位;脱离文档流的布局,但还在文档流的位置遗留空白区域。定位的起始位置为此元素原先在文档流的位置。

2.2.2 视图

2.3 position:fixed

2.3.1 说明

固定定位;类似于absolute,但不随着滚动条的移动而改变位置。

2.3.2 视图

2.3.3 应用场景

①登录框覆盖层:如dz论坛的登录。

②虚假QQ消息广告。

2.4 position:static

2.4.1 说明

无定位,表示此元素为默认定位方式。

2.4.2 应用场景

IE6的特殊处理。

3.总结

3.1 滚动条是否出现

当含有position属性的元素为最边缘元素时:

①absolute 和 relative :含有此2个值的边缘元素,浏览器缩小到此元素不可见时,会出现滚动条。

②fixed :含有此值的边缘元素,浏览器缩小到此元素不可见时,不会出现滚动条。

3.2 示例

3.2.1 视图

http://www.cnblogs.com/polk6/p/3214847.html

css position[转的更多相关文章

  1. css position的使用

    css position的使用 css 的 position 属性是用来设置元素的位置的,它还能设置一个元素出现在另一个元素的下层元素能用 top,bottom,left 和 right 属性设置位置 ...

  2. CSS position绝对定位absolute relative

    常常使用position用于层的绝对定位,比如我们让一个层位于一个层内具体什么位置,为即可使用position:absolute和position:relative实现. 一.position语法与结 ...

  3. jQuery offset,position,offsetParent,scrollLeft,scrollTop html控件定位 css position

    定位应用:点击一个按钮,然后在按钮的右边弹出一个提示框 1,提示框相对于屏幕进行定位,那么使用offset来取得当前按钮相对于body的top和left,然后通过$('body').prepend(t ...

  4. [CSS]position定位

    CSS position 属性 通过使用 position 属性,我们可以选择 4 种不同类型的定位,这会影响元素框生成的方式. position 属性值的含义: static 元素框正常生成.块级元 ...

  5. jQuery css,position,offset,scrollTop,scrollLeft用法

    jQuery css,position,offset,scrollTop,scrollLeft用法: <%@ page language="java" import=&quo ...

  6. CSS position(定位)属性

    关于CSS position,来自MDN的描述: CSS position属性用于指定一个元素在文档中的定位方式.top.right.bottom.left 属性则决定了该元素的最终位置. 然后来看看 ...

  7. CSS position &居中(水平,垂直)

    css position是个很重要的知识点: 知乎Header部分: 知乎Header-inner部分: position属性值: fixed:生成绝对定位的元素,相对浏览器窗口进行定位(位置可通过: ...

  8. CSS position属性absolute relative等五个值的解释

    DIV CSS position绝对定位absolute relative教程篇 常常使用position用于层的绝对定位,比如我们让一个层位于一个层内具体什么位置,为即可使用position:abs ...

  9. 前端开发必知必会:CSS Position 全解析

    此文根据Steven Bradley的<How Well Do You Understand CSS Positioning?>所译,整个译文带有我自己的理解与思想,如果译得不好或不对之处 ...

  10. jquery 获取css position的值

      jquery 获取css position的值 CreateTime--2018年5月28日14:03:12 Author:Marydon 1.情景展示 <div id="aa&q ...

随机推荐

  1. centos redis集群搭建

    说明: 10.0.0.111部署6500,6501,6502三个主节点 10.0.0.222部署6500,6501,6502三个备份节点 1.安装redis:略 2.配置内核参数 # 配置 vm.ov ...

  2. C++ STL sort()函数用法

    C++STL提供的在里的排序函数,有以下两种形式 此外还提供有稳定排序版本stable_sort(),用法类似. 第一种形式: template <class RandomAccessItera ...

  3. 【摘】SVN提交与版本冲突

    一般性解决办法 1.要提交的内容备份到项目之外[为还原版本做准备] 2.还原[回到之前版本] 3.更新[更新版本号和版本] 4.填充内容[即 将自己之前备份的内容填充项目对应处] 5.提交 6.OK ...

  4. 使用Jupyter lab前应该读的几篇文章

    知乎上的一篇文章: 如何优雅的使用Jupyter? Jupyter Lab原来还有如下使用方式: 执行Shell命令 Hintland(提示命令).snippets(插入代码段).一键美化代码等功能( ...

  5. jmeter中实现java请求实战日志

    view code public class JdbcInsert implements JavaSamplerClient { // 全局变量 PreparedStatement pstmt; Co ...

  6. 【黑客免杀攻防】读书笔记7 - 软件逆向工程基础1(函数调用约定、Main函数查找)

    0x1 准备工作 1.1.准备工具 IDA:交互式反汇编工具 OllyDbg:用户层调试工具 Visual Studio:微软开发工具 1.2.基础知识 C++开发 汇编语言 0x2 查找真正的mai ...

  7. MySQL— 进阶

    目录 一.视图 二.触发器 三.函数 四.存储过程 五.事务 一.视图 视图是一个虚拟表(非真实存在),其本质是[根据SQL语句获取动态的数据集,并为其命名],用户使用时只需使用[名称]即可获取结果集 ...

  8. php 日期格式转换万能公式

    思路用strtotime转换时间的字符串 $t='2017-03-09 02:30'; echo(date('Y-m-d H-i', strtotime($t)));

  9. [BZOJ3295] [Cqoi2011]动态逆序对(带修改主席树)

    题目描述 对于序列A,它的逆序对数定义为满足i<j,且Ai>Aj的数对(i,j)的个数.给1到n的一个排列,按照某种顺序依次删除m个元素,你的任务是在每次删除一个元素之前统计整个序列的逆序 ...

  10. 如何判断mac地址时multicast还是broadcast ?

    ethernet 的地址其实就是mac地址,长度为6 byte,其中有一位为 multicast bit 位. 当unicast/multicast bit 位置1时就是 multicast,mac ...