美文网首页
8、三种定位及特性

8、三种定位及特性

作者: 波罗的海de夏天 | 来源:发表于2017-06-20 00:19 被阅读0次

定位:把一个元素,按照一定的方式设置在页面的摸一个位置;

    position
        1、相对定位 relative
            针对自己本身的位置进行定位;
        2、绝对定位 absolute
            针对有定位的父级的原点进行定位;父级无定位针对父级的父级...;如果都没有针对document;
            温馨提示:绝对定位即使没有初始值,也一定要设置值;(left:0px; top:0px;)
        3、固定定位 fixed
            针对页面窗口进行定位;
            温馨提示:IE6,不支持固定定位;

    偏移量
        left、top、right、bottom
        温馨提示:left、top优先级高于right、bottom;

三种定位的特性:

    相对定位 relative
        1、不影响元素本身的特性;
        2、不使元素脱离文档流;
        3、提升层级; 
        4、无法触发BFC;
        5、针对自己本身进行定位;

    绝对定位 absolute
        1、会使元素完全脱离文档流;
        2、内容撑开宽度和高度;
        3、使元素支持所有的css样式;
        4、提升层级;
              z-zoom:数值;定位层级设置;(数值越大,层级越高)
        5、绝对定位要和相对定位配合使用;
        6、如果有定位父级,针对定位父级发生偏移,没有定位父级,针对document进行偏移;
        7、如果绝对定位的子级有浮动,可以省略清浮动(BFC)操作;

    固定定位 fixed
        1、针对窗口进行定位
        2、不支持IE;
        3、如果固定定位的子级有浮动,可以省略清浮动(BFC)操作;

派生选择器:

   是由id选择器、class选择器、标签名选择器组合而成;
   根据选择器优先级精确控制标签;
       比如可以假设:id选择器:10000、class选择器:100、标签名选择器:1;

相关文章

  • 8、三种定位及特性

    定位:把一个元素,按照一定的方式设置在页面的摸一个位置; 三种定位的特性: 派生选择器:

  • 《定位》全书结构及问题(1-8章)

    《定位》前8章全书结构及每章问题。

  • HTML+CSS基础

    1、HTML常用字符实体 2、CSS 规定的定位机制有三种,分别是标准文档流、浮动及绝对定位。

  • 普通元素垂直水平居中原理、单行多行文字垂直水平居中

    一、普通元素三种垂直水平居中 如图: absolute小技巧 原理:利用绝对定位元素的盒模型特性,在偏移属性为确定...

  • XPATH、CSS选择器及正则表达式

    在爬虫采集数据的过程中,如何定位及匹配数据是必须解决的一项任务。最常用的定位方式有三种:XPATH,CSS选择器及...

  • CSS布局简单笔记

    CSS规定的定位机制有三种,分别是标准文档流、浮动及绝对定位。 块级元素特点:从左到右撑满页面,独占一行;触碰到页...

  • CSS浮动

    浮动 布局的三种基本方式:标准流 按照标签默认的特性摆放盒子即为标准流浮动流 利用浮动摆放盒子即为浮动流定位流 利...

  • Vue2.0兼容IE10+

    Vue 不支持 IE8 及以下版本,因为 Vue 使用了 IE8 无法模拟的 ECMAScript 5 特性。但它...

  • java9的新特性

    1、Java9 新特性之---目录结构 包含jdk8及以前的jdk版本,所有目录结构以及目录含义如图: 这个新特性...

  • lambda表达式

    概要: 函数式编程特性 lambda表达式语法及应用场景 Java 8自带函数式接口详解 一、函数式编程特性 1....

网友评论

      本文标题:8、三种定位及特性

      本文链接:https://www.haomeiwen.com/subject/syvnqxtx.html