-
z-index 值越大，越靠近用户 relative 在层级方面的表现： 1. 提高层叠上下文（鬼畜级别） 页面有两张图片出现层叠情况，默认后一张图片层叠前一张，如果设置前一张图片position：relative，则前一张会层叠在前 2.新建层叠上下文与层级控制 relative 的z-index 为一个具体的数值，那么就会新建一个层叠上下文，从而限制内部absolute元素的层叠。而为auto（可以dayue 理解为z-index 为0）的话，就不会新建一个层叠上下文（ie6、7除外，是个bug） relative的z-index:为auto时 不会限制内部absolute查看全部
-
relative 相对于自身定位，不会影响其他元素的布局 无侵入：即他不会影响其他元素的布局，比如说：如果是margin-top：-100px；移走后，紧接着这个div的div也会向上移动；如果是top:-100px，则不会，后面的元素会保持不动.应用：自定义拖拽 当top和bottom，或者left和right同时存在时，如果是relative定位，这只有一方存在，即top和left；但如果是absolute定位，这两者可以同时存在，起到拉伸的效果 top vs bottom left vs right top left胜查看全部
-
overflow hidden可以限制普通元素隐藏 但对于absolute的元素不起任何作用 position: relative;left：10px;top:10px; relative 的第一个作用：起到定位的作用；left和top是指相对于它原来位置的定位。 relative 是不脱离文档流的（意思就是它原有的位置是保留的，其他元素无法占据）。所以相对定位通常只是用作限制绝对定位的。 如截图所示，relative 对absolute的限制有三方面 1、限制定位 2、限制z-index层级（就是说，如果relative设置了z-index层级并且为具体的数字，而不是auto，那么内部的absolute设置的层级就不管用了） 3、限制在overflow下的嚣张气焰（只有加上relative，overflow：hidden、auto，滚动条，才会对absolute定位的元素起作用） relative 对 fixed 的限制只有z-index查看全部
-
relative要遵循避免原则和最小化原则，即能不用relative则不用，relative作用的div范围越小越好 不使用relative，仅仅使用absolute+margin微调(可选) 单独对某一个元素进行绝对定位的时候，可以把它提取出来，用一个空的div包裹起来（relative），本身运用absolute，就OK了。查看全部
-
relative 相对于自身定位，不会影响其他元素的布局 无侵入：即他不会影响其他元素的布局，比如说：如果是margin-top：-100px；移走后，紧接着这个div的div也会向上移动；如果是top:-100px，则不会，后面的元素会保持不动.应用：自定义拖拽 当top和bottom，或者left和right同时存在时，如果是relative定位，这只有一方存在，即top和left；但如果是absolute定位，这两者可以同时存在，起到拉伸的效果 top vs bottom left vs right top left胜查看全部
-
overflow hidden可以限制普通元素隐藏 但对于absolute的元素不起任何作用 position: relative;left：10px;top:10px; relative 的第一个作用：起到定位的作用；left和top是指相对于它原来位置的定位。 relative 是不脱离文档流的（意思就是它原有的位置是保留的，其他元素无法占据）。所以相对定位通常只是用作限制绝对定位的。 如截图所示，relative 对absolute的限制有三方面 1、限制定位 2、限制z-index层级（就是说，如果relative设置了z-index层级并且为具体的数字，而不是auto，那么内部的absolute设置的层级就不管用了） 3、限制在overflow下的嚣张气焰（只有加上relative，overflow：hidden、auto，滚动条，才会对absolute定位的元素起作用） relative 对 fixed 的限制只有z-index查看全部
-
relative 的最小化影响原则，指的是尽量降低relative属性对齐他元素或布局的潜在影响。 relative要遵循避免原则和最小化原则，即能不用relative则不用，relative作用的div范围越小越好 <div > <img src="pig_head.png" > </div> <div> <div></div> <div></div> <div></div> </div>查看全部
-
z-index 值越大，越靠近用户 relative 在层级方面的表现： 1. 提高层叠上下文（鬼畜级别） 页面有两张图片出现层叠情况，默认后一张图片层叠前一张，如果设置前一张图片position：relative，则前一张会层叠在前 2.新建层叠上下文与层级控制 relative 的z-index 为一个具体的数值，那么就会新建一个层叠上下文，从而限制内部absolute元素的层叠。而为auto（可以dayue 理解为z-index 为0）的话，就不会新建一个层叠上下文（ie6、7除外，是个bug）查看全部
-
relative 相对定位的特点： 1、相对于自身 2、无侵入（也就是说当设置relative定位时，是不会影响任何其他的布局的。假如用margin来定位，那么其他的元素是会随着移动的） 3、只设置left、top来定位，同时设置四个方向的话也是left和top会胜出 absolute 绝对定位时相对于 离它最近的限制它的元素，一层一层往上找，如果都没有对它进行限制，最后会找到body，也就是相对于body定位查看全部
-
position: relative;left：10px;top:10px; relative 的第一个作用：起到定位的作用；left和top是指相对于它原来位置的定位。 relative 是不脱离文档流的（意思就是它原有的位置是保留的，其他元素无法占据）。所以相对定位通常只是用作限制绝对定位的。 如截图所示，relative 对absolute的限制有三方面 1、限制定位 2、限制z-index层级（就是说，如果relative设置了z-index层级并且为具体的数字，而不是auto，那么内部的absolute设置的层级就不管用了） 3、限制在overflow下的嚣张气焰（只有加上relative，overflow：hidden、auto，滚动条，才会对absolute定位的元素起作用） relative 对 fixed 的限制只有z-index查看全部
-
单独对某一个元素进行绝对定位的时候，可以把它提取出来，用一个空的div包裹起来（relative），本身运用absolute，就OK了。查看全部
-
所谓relative的最小化影响原则，指的是尽量降低relative属性对其他元素或布局的潜在影响. relative作用的div范围越小越好. <div position:relative> <img src positon:absolute.top right> </div>查看全部
-
relative z-index:为auto时 不会限制内部absolute元素层叠查看全部
-
单独定义一个div包裹要绝对定位的元素，是relative最小化原则查看全部
-
relative z-index:为auto时 不会限制内部absolute元素层叠查看全部
举报
0/150
提交
取消