position

  • absolute:绝对定位

1.以页面的左上角为原点

2.不保留原来的位置

3.z-index可以调整图层顺序

如果想实现以父级元素左上角为原点。则:父级相对,子级绝对

在子级绝对的情况下,将父级调成相对就是以父元素左上角为原点。

  • relative:相对定位

    1,以自己的左上角为原点

2,保留原来的位置

3,z-index用来调整图层顺序

fixed:固定

将盒子固定在一个地方,一般做广告的显示

position:fixed;

right:0px;

bottom:0px;

  • static:静态(默认定位,按照标准流排列)

css——定位的更多相关文章

  1. css定位

    文档流 所谓的文档流,指的是元素排版布局过程中,元素会自动从左往右,从上往下的流式排列.并最终窗体自上而下分成一行行, 并在每行中按从左至右的顺序排放元素.脱离文档流即是元素打乱了这个排列,或是从排版 ...

  2. 常用的CSS定位,XPath定位和JPath定位

    CSS定位 举例 描述 div#menu id为menu的div元素 div.action-btn.ok-btn class为action-btn和ok-btn的div元素 table#emailLi ...

  3. div+css定位position详解

    div+css定位position详解 1.div+css中的定位position 最主要的两个属性:属性 absolute(绝对定位) relative(相对定位),有他们才造就了div+css布局 ...

  4. CSS 定位

    一.CSS 定位和浮动   它们代替了多年来的表格布局.   定位的思想很简单,相对于正常位置.相对于父元素.另一个元素甚至是浏览器窗口的位置.   浮动在 CSS1 中被首次提出.浮动不完全是定位, ...

  5. Selenium自动化中DOM,XPATH,CSS定位Web页面对象的优劣性分析

    加速IE浏览器自动化执行效率:Selenium自动化中DOM,XPATH,CSS定位Web页面对象的优劣性分析 1.技术背景       在Web应用中,用户通过键盘在输入框中输入值和鼠标点击按钮,链 ...

  6. CSS定位小技巧

    CSS定位Static 默认定位Relative 相对定位:left 和topposition: relative;/*相对定位*/ left:40px;/*在原来的位置向右移动*/ top:100p ...

  7. (七)CSS定位(Positioning)

    CSS定位属性允许对元素进行定位. 一切皆为框: div.h1或p元素常被称为块级元素,而span和strong等元素成为行内元素,但是可是使用 display 属性改变框的类型,将display设置 ...

  8. CSS定位(CSS定位概述、相对定位、绝对定位、浮动)

    CSS 定位属性 CSS 定位属性允许你对元素进行定位. 属性 描述 position 把元素放置到一个静态的.相对的.绝对的.或固定的位置中. top 定义了一个定位元素的上外边距边界与其包含块上边 ...

  9. CSS定位(postion)和移动(float)

    5.定位和移动:Positioning(定位)CSS定位属性允许你为一个元素定位.它也可以将一个元素放在另一个元素后面,并指定一个元素的内容太大时,应该发生什么. 元素可以使用的顶部,底部,左侧和右侧 ...

  10. CSS定位属性Position详解

    CSS中最常用的布局类属性,一个是Float(CSS浮动属性Float详解),另一个就是CSS定位属性Position. 1. position:static 所有元素的默认定位都是:position ...

随机推荐

  1. 【udacity】机器学习-2模型验证

    Evernote Export 1.模型的评估与验证简介 机器学习通常是大量传入数据,然后会有一些关于数据的决策.想法和摘要. 2.模型评估 评估模型使用的是各种数据分析的方法,至少需要使用pytho ...

  2. C语言基础 (8) 常用字符串处理函数

    复习 如何调用库函数(别人写好的函数) 1)       头文件:包含指定的头文件,头文件主要包含此函数的声明 2)       函数名字:函数名字必须和头文件声明的名字一样 字符串常用处理函数: 1 ...

  3. 阿里云服务上面部署redis + 本地Redis客户端连接方法

    本文结合自己在阿里云服务器上面搭建redis服务器,在本地redis的客户端Redis Desktop Manager连接成功的操作,将操作中的一些方法做了一些归纳和总结,希望可以帮到有需要的同学. ...

  4. HDU 2439 The Mussels

    The Mussels Time Limit: 1000ms Memory Limit: 32768KB This problem will be judged on HDU. Original ID ...

  5. windows系统中软件开发常用的软件

    1.windwos快速打开控制面板:热键+r打开运行框,输入control就打开windows的控制面板了 2.windows自带的远程桌面控制系统:mstsc -Microsoft terminal ...

  6. android Service中多线程交互

    android 的service和activity是执行在UI主线程的. 在android线程中,仅仅有主线程即UI线程有自己的默认的消息队列.子线程须要创建自己的消息队列.并把消息发给队列,并循环起 ...

  7. STL之效率比較

    1.vector 变长一维数组,连续存放的内存块,有保留内存.堆中分配内存: 支持[]操作,高效率的随机訪问: 在最后添加元素时,一般不须要分配内存空间,速度快:在中间或開始操作元素时要进行内存拷贝效 ...

  8. jenkins启动失败

    一:http://localhost:8080已经可以进了 二:修改端口 只是因为8080端口已经有程序占用了,需要修改端口号,但是在jenkins.xml文件中修改端口号,并不起作用. 解决方法是: ...

  9. Codeforces Round #272 (Div. 2) 题解

    Codeforces Round #272 (Div. 2) A. Dreamoon and Stairs time limit per test 1 second memory limit per ...

  10. Ruby学习笔记(二)——从管道读取数据

    在对文件名修改后,今天又给自己出了新的难题,想从实验结果中提取数据,并将其作为文件夹的名称.其中,比赛的主办方提供的评估算法是用perl写的,因此读取实验结果最为简单的想法自然是使用管道命令,即 ./ ...