zoukankan      html  css  js  c++  java
  • Css Position定位(简易版本)

    准备前的知识:

    定位只对块级起作用。如div,p等元素是块级元素,如果是内联元素则可以先变成块级元素,display:block即可。

    开始讲解:

    定位共四种:static,fixed,relative,absolute.

    第一种:static为div默认,top,left,bottom,right无用。

    第二种:fixed为固定定位。

    元素的位置相对于浏览器窗口是固定位置。即使窗口是滚动的它也不会移动.
    Fixed定位使元素的位置与文档流无关,因此不占据空间。Fixed定位的元素和其他元素重叠。

    第三种:relative为相对定位

    相对定位元素的定位是相对其正常位置。可以移动的相对定位元素的内容和相互重叠的元素,它原本所占的空间不会改变

     

    第四种:absolute为绝对定位

    绝对定位的元素的位置相对于最近的已定位父元素,如果元素没有已定位的父元素,那么它的位置相对于<html>:

    absolute 定位使元素的位置与文档流无关,因此不占据空间

    absolute 定位的元素和其他元素重叠。

    总结:

    序列 position定位属性 是否占空间 是否与元素重叠
    1 fixed 不占   重叠
    2 relative 占   可以控制top,left与其他元素重叠
    3 absolute 不占 重叠

    常用技巧:
    relative与absolute配合使用:
    最外div使用relative定位,里面用absolute定位。

  • 相关阅读:
    详细的解说public,protected,Default和private的权限问题
    谈谈java中静态变量与静态方法在有继承关系的两个类中调用
    谈谈java中成员变量与成员方法继承的问题
    谈谈嵌套for循环的理解
    JAVA基础细谈
    Css的使用细谈
    Hibernate映射
    hibernate基本
    struts2
    s:form标签
  • 原文地址:https://www.cnblogs.com/300js/p/7444664.html
Copyright © 2011-2022 走看看