以上的代码,兄弟元素的设置position后会覆盖img好理解,该如何理解父元素设置position后不会覆盖img?设置position后不是相当于z-index:auto,类似层叠顺序z-index为0吗层叠顺序应该高于img啊?
一般的定位元素(z-index未设置,默认auto)是不会创建层叠上下文的。所以你的例子 父元素的背景当然就被子元素覆盖,而sisiter元素block当然就覆盖img元素(inline-block)。然后说下层叠上下文。层叠上下文只是针对子元素的。这样index数值是负数的时候就会显示在父元素背景之上!!
z-index为auto的元素不参与层级关系的比较,由向上遍历至此且z-index不为auto的元素来参与比较。
好像是设置了position之后,z-index才有效吧,如果有父元素的话,子元素和父元素有从属关系,由父元素的显示层次决定子元素的显示层次。