1、使用position中的absolute要与relative配套使用，如果不使用relative时默认absolute会用整个视窗作为参照物；如果relative放在absolute的父级标签上，则absolute会以父级块标签作为参照物调整位置，absolute要使用top、left、right、bottom属性来调整位置

2、使用position的fiexed是固定定位。我在使用时遇到的问题：

，

上面是有问题的图片，导航栏没有固定到在顶部。

注意：试验中，上面图片中的position是fiexed而不是relative

因为使用position的fiexed没有加上top：0所以没有固定到顶部。

添加了top之后我的导航栏变正常了，不会像上图那样漏出一条缝

使用position属性的心得的更多相关文章

  1. 总结一下CSS中的定位 Position 属性

    在CSS中,Position 属性经常会用到,主要是绝对定位和相对定位,简单的使用都没有问题,尤其嵌套起来,就会有些混乱,今记录总结一下,防止久而忘之. CSS position 属性值: absol ...

  2. Position属性四个值：static、fixed、absolute和relative的区别和用法

    Position属性四个值:static.fixed.absolute和relative的区别和用法 在用CSS+DIV进行布局的时候,一直对position的四个属性值relative,absolu ...

  3. 由position属性引申的关于css的进阶讨论（包含块、BFC、margin collapse）

    写这篇文章的起因是源于这篇文章:谈谈面试与面试题 中关于position的讨论,文中一开始就说的这句话: 面试的时候问个css的position属性能刷掉一半的人这是啥情况…… 其实这问题我本来打算的 ...

  4. Css中的Position属性

    Css中的Position属性 Css属性在线查询地址: http://www.css88.com/book/css/properties/index.htm CSS 中的 position 属性 在 ...

  5. DIV的Position属性和DIV嵌套DIV

    1.前言 我们在利用div+css进行布局时,常常被div的位置弄的焦头烂额,很多人甚至放弃了div而直接用table.这里一如既往的推荐使用div布局,其实我们只要掌握了div的position属性 ...

  6. position属性的四个value

    As we all know, position属性有四个值,分别为 relative,fixed,absolute, static. 1,relative相对定位 (不会脱离文档流) 在一个相对定位 ...

  7. 几种Position属性的用法

    几种Position常见的属性就是一下几种: 1.static:默认值.没有定位,元素出现在正常的流中(忽略 top, bottom, left, right 或者 z-index 声明). 2.re ...

  8. css中关于position属性的探究（原创）

    关于position属性的设置,头脑中一直觉得不是很清楚,所以借助这次机会单独自己测试了一下,记作学习笔记.   首先,css的position属性包含下面四种设置情况: static:默认属性.指定 ...

  9. 详解css中的position属性

    这一次直接进入主题. css中最常用的布局类属性,一个是float,另一个就是定位属性position. 对于position来讲,有以下属性值: static : 无特殊定位,对象处于正常文档流.其 ...

随机推荐

  1. Autoware docker 环境安装

    环境: ubuntu 16.04    GPU:GeForce 1070   nvidia 驱动型号:nvidia_driver_390.67 安装参考网址: https://github.com/C ...

  2. C++之PIMPL模式

    1 PIMPL解释 PIMPL(Private Implementation 或 Pointer to Implementation)是通过一个私有的成员指针,将指针所指向的类的内部实现数据进行隐藏. ...

  3. JAVA 中的堆和栈

    栈与堆都是Java用来在Ram中存放数据的地方.与C++不同,Java自动管理栈和堆,程序员不能直接地设置栈或堆.     Java的堆是一个运行时数据区,类的对象从中分配空间.这些对象通过new.n ...

  4. [转载]Doxygen C++ 注释风格

    转载自:http://luchenqun.com/?p=761 做一个C++方面的符合Doxygen的注释文档,备用. 1.头文件根原文件注释.这个我也不知道需要注释什么.能想到的是:谁写的,里面有些 ...

  5. org.apache.catalina.LifecycleException报错解决方法

    严重: A child container failed during startjava.util.concurrent.ExecutionException: org.apache.catalin ...

  6. 安装java之后，找不到tools.jar 和dt.jar

    可能很多初学者和我一样,在初次接触java开发的过程中,急于看到最终的结果,匆匆在网上下载了jdk之后,点击安装,结果等安装完,开始配置classpath时,发现jdk/lib下面根本就没有 tool ...

  7. ssl 证书申请

    https(全称:Hyper Text Transfer Protocol over Secure Socket Layer),是以安全为目标的 http 通道,简单讲是 http 的安全版.即 ht ...

  8. 设置a 标签打开新窗口新姿势

    设置页面中的所有a标签都打开新窗口 1,在写的时候就加上target="_blank" 2,在页头<head></head>里加上 <base tar ...

  9. 洛谷 - P2568 - GCD - 欧拉函数

    https://www.luogu.org/problemnew/show/P2568 统计n以内gcd为质数的数的个数. 求 \(\sum\limits_p \sum\limits_{i=1}^{n ...

  10. 計蒜客/小教官(xjb)

    題目鏈接:https://nanti.jisuanke.com/t/366 題意:中文題誒~ 思路: 先通過給出的條件構造一個符合題意的數組(可以是任意一個符合條件的數組,菜雞不會證明: 然後構造的數 ...