relative属性

  1. relative与absolute的关系

    • relative限制absolute

      • 限制定位
      • 限制层级（relative的层级）
      • 限制超越overflow
    • relative限制fixed
      • 限制层级

  2. relative的定位

    • 相对自身定位
    • 无侵入定位
    • left/top/right/bottm优先级
      • left>right
      • top>bottm

  3. relative与层级

    1. realtive提高层级
    2. 新建层级与上下文
      • position:relative;   z-index:auto    ==> 不产生层级

  4. relative的最小化影响原则

    1. 尽量不适用relative
    2. relative最小化
时间： 2024-08-18 21:04:30

relative属性的相关文章

兼容性—IE6/7下带有overflow:hidden属性的父级元素包不住带有position：relative属性的子元素

IE6/7下带有overflow:hidden属性的父级元素包不住带有position:relative属性的子元素 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style> .box{ width: 200px; height: 200px; bord

CSS中&quot;position:relative&quot;属性与文档流的关系

前言 近期遇到一个问题--"position:relative"到底会不会导致元素脱离文档流?主流观点是不会,但都给不出一个有说服力的论据.最后我自己佐证了一番,总算有了个结果:"position:relative"不会导致元素脱离文档流. 博文地址:CSS中"position:relative"属性与文档流的确切关系 "relative"与文档流 说到标准,最权威的自然莫过于CSS标准文档.经过一番繁琐的查找之后(w3c网站

【webQD】☆★之详解position: absolute、relative属性

[webQD]☆★之详解position: absolute.relative 首先我们来看一下W3C对position的解释: 我们再看,W3C对position属性值的解释: ok,我们需要了解的是: 其中absolute和relative是最常用的,fixed用得也比较多(其中IE6并不支持fixed). 1.absolute(绝对定位) absolute是生成觉对定位的元素,脱离了文本流(即在文档中已经不占据位置),参照浏览器的左上角通过top,right,bottom,left(简称T

解决td标签上的position:relative属性在各浏览器中的兼容性问题

在css中的position属性规定了页面元素的定位类型,它有以下几个值: absolute:绝对定位,相对于static以外的第一个父元素进行定位: fixed:生成绝对定位的元素,相对于浏览器窗口进行定位: relative:生成相对定位的元素,相对于其正常位置进行定位: static:默认值,没有定位: inherit:继承父元素的position值: 如果一个块A要在块B中进行绝对定位,则我们可以把块A的position值定为absolute,把块B的属性值定为relative,这样,块

[转载]position的四个属性值： relative ，absolute ，fixed，static

position的四个属性值: relative ,absolute ,fixed,static  下面分别讲述这四个属性,以简单代码表示 <div id="parent">     <div id="sub1">sub1</id>     <div id="sub2">sub2</id></div> 1. relative relative属性相对比较简单,我们要搞清它是相

position的relative和absolute属性

在对界面布局时,往往需要用到position属性.在W3C中,对position的定义是:规定元素的定位类型. 顾名思义,absolute代表绝对定位.在查阅了相关资料后,发现absolute定位是相对于其包含块(containing block)绝对定位,而这个包含块不一定是父级元素.例如,当父级元素没有设定position属性,而父级以上的某个祖先元素设了position并且不是static(默认既是static),那么设定了absolute的子元素即以此为包含块.也就是说,一个元素的包含块

position的四个属性值： relative ，absolute ，fixed，static

position的四个属性值: relative ,absolute ,fixed,static  下面分别讲述这四个属性,以简单代码表示 <div id="parent">     <div id="sub1">sub1</id>     <div id="sub2">sub2</id></div> 1. relative relative属性相对比较简单,我们要搞清它是相

css深入理解relative

第一讲     relative和absolute相煎关系 同源性 .position:relative .position:absolute 限制作用 1.限制left/top/right/bottom定位 2.限制z-index层级 3.限制在overflow下嚣张气焰 1.限制定位,如果没有relative限制,元素定位absolute会可以在任何地方定位 2.限制层级 z-index 层级越高 3.限制超越overflow relative与fixed 同源性 .position:rel

div层调整zindex属性无效原因分析及解决方法

在做的过程中,发现了一个很简单却又很多人应该碰到的问题,设置Z-INDEX属性无效.在CSS中,只能通过代码改变层级,这个属性就是z- index,要让z-index起作用有个小小前提,就是元素的position属性要是relative,absolute或是fixed. 1.第一种情况(z-index无论设置多高都不起作用情况): 这种情况发生的条件有三个: 1.父标签 position属性为relative: 2.问题标签无position属性(不包括static): 3.问题标签含有浮动(f