第一种位置关系:position:fixed  锁定位置(相对于整个浏览器的位置),常用在各大网站的右下角或其它位置的小广告。

如果需要调整锁定位置,需要使用如下方式:<div style="width:300px; height:300px; position:fixed; top:0px; left:0px; right:0px; bottom:0px" ></div>

  第二种位置关系:position:absolute 绝对位置(相对于父级元素--浏览器,绝对定位的上级) 

(1)最外边没有absolute,则调整时div相对于浏览器变化;(2)最外面有absolute,则调整时div相对于最外层边界变化。

如果需要调整绝对位置,需要使用如下方式:<div style="width:300px; height:300px; position:absolute; top:0px; left:0px; right:0px; bottom:0px" ></div>

  第三种位置关系:position:relative 相对位置(相对于自身应该出现的位置)

如果需要调整相对位置,需要使用如下方式:<div style="width:300px; height:300px; position:relative; top:0px; left:0px; right:0px; bottom:0px" ></div>

CSS格式与布局中三种位置的理解与应用的更多相关文章

  1. 关于CSS格式与布局中的基础知识的简单操作

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  2. iOS开发UI篇—iOS开发中三种简单的动画设置

    iOS开发UI篇—iOS开发中三种简单的动画设置 [在ios开发中,动画是廉价的] 一.首尾式动画 代码示例: // beginAnimations表示此后的代码要“参与到”动画中 [UIView b ...

  3. 【转】css清除浮动float的三种方法总结,为什么清浮动?浮动会有那些影响?

    摘要: css清除浮动float的三种方法总结,为什么清浮动?浮动会有那些影响?     一.抛一块问题砖(display: block)先看现象: 分析HTML代码结构: <div class ...

  4. 转-Web Service中三种发送接受协议SOAP、http get、http post

    原文链接:web服务中三种发送接受协议SOAP/HTTP GET/HTTP POST 一.web服务中三种发送接受协议SOAP/HTTP GET/HTTP POST 在web服务中,有三种可供选择的发 ...

  5. Android中三种超实用的滑屏方式汇总(转载)

    Android中三种超实用的滑屏方式汇总   现如今主流的Android应用中,都少不了左右滑动滚屏这项功能,(貌似现在好多人使用智能机都习惯性的有事没事的左右滑屏,也不知道在干什么...嘿嘿),由于 ...

  6. C#中三种定时器对象的比较

    ·关于C#中timer类 在C#里关于定时器类就有3个1.定义在System.Windows.Forms里2.定义在System.Threading.Timer类里3.定义在System.Timers ...

  7. C#中三种定时器对象的比较 【转】

    https://www.cnblogs.com/zxtceq/p/5667281.html C#中三种定时器对象的比较 ·关于C#中timer类 在C#里关于定时器类就有3个1.定义在System.W ...

  8. Spring中三种配置Bean的方式

    Spring中三种配置Bean的方式分别是: 基于XML的配置方式 基于注解的配置方式 基于Java类的配置方式 一.基于XML的配置 这个很简单,所以如何使用就略掉. 二.基于注解的配置 Sprin ...

  9. 深入浅出spring IOC中三种依赖注入方式

    深入浅出spring IOC中三种依赖注入方式 spring的核心思想是IOC和AOP,IOC-控制反转,是一个重要的面向对象编程的法则来消减计算机程序的耦合问题,控制反转一般分为两种类型,依赖注入和 ...

随机推荐

  1. 读书笔记-Software Testing(By Ron Patton)

    Software Testing Part I:The Big Picture 1.Software Testing Background Bug's formal definition 1.The ...

  2. 新笔记tst

    这是测试文章 来自为知笔记(Wiz)

  3. python打印万年历

    1.输入年份,输入月份 2.格式化输出本月的日历 3.思路 输入年,月,打印对应年月的日历.1,首先1970年是Unix系统诞生的时间,1970年成为Unix的元年,1970年1月1号是星期四,现在大 ...

  4. javascript之数组快速排序

    快速排序思想其实还是挺简单的,分三步走: 1.在数组中找到基准点,其他数与之比较. 2.建立两个数组,小于基准点的数存储在左边数组,大于基准点的数存储在右边数组. 3.拼接数组,然后左边数组与右边数组 ...

  5. 正则表达式小结(Regular Expressions)

    (原创文章,谢绝转载~) 日常开发中,常用正则表达式方便的进行匹配.筛选工作.正则的常用内容有: 一般情况下原则:从左至右,越多越好(贪婪) 字符:转义:\ ,如 \*,\d (数字)等 选择,cas ...

  6. 【Python】debug工具-pdb(转)

    Debug功能对于developer是非常重要的,python提供了相应的模块pdb让你可以在用文本编辑器写脚本的情况下进行debug. pdb是python debugger的简称. 常用的一些命令 ...

  7. .NET Core 成都线下面基会拉开序幕

    2017年07月29日下午,由 .NET China Foundation 成都小组组织的 .NET Core 成都地区线下技术交流会在成都成华区某茶楼成功举行,这也是成都地区 .NET Core 非 ...

  8. CrashMonkey4Android 的安装及使用

    CrashMonkey4Android 的安装及使用 简介 CrashMonkey4Android,是一个依靠Cts框架,对原生Monkey进行改造后的产物,拥有以下新增功能: 保存每一步的截图 保存 ...

  9. Hadoop - 国内各站点最高温度、气压和风速统计

    版权说明:  本文章版权归本人及博客园共同所有,转载请标明原文出处(http://www.cnblogs.com/mikevictor07/),以下内容为个人理解,仅供参考. 一.简介 该实例统计国内 ...

  10. JavaSE(七)之内部类

    上一篇我们学习了接口还有访问控制,在以后的工作中接口是我们经常要碰到的,所以一定要多去回顾.接下来介绍一下内部类.很多时候我们创建类的对象的时候并不需要使用很多次,每次只使用一次 这个时候我们就可以使 ...