tan90qian 发表于 2018-8-19 14:04:41

6/5-4例子在样式上的疑惑

文中写到“一个绝对定位的元素,没有任何定位方向属性的设置,并且其祖先元素全部都是非定位元素,其位置还是在当前位置,不是在浏览器左上方”
以及
“‘无依赖绝对定位’本质上就是相对定位,仅仅是不占据CSS流的尺寸空间”

并用6/5-4.php作为证明的例子,但实际上假如将容器的width设置的更大一些,然后将图片取消绝对定位的属性,它会与后一张图片一起以baseline为下边缘对齐且相对容器水平居中(即处于CSS流中)。
而重新激活绝对定位属性后,它在水平方向上并没有居中对齐(即脱离了CSS流),也没有贴着视窗左边缘(即left确实不为0),而是出现在后一张图片的左上角。
而假如此时在两张图片之间插入一些普通文本,则绝对定位图片在水平方向上与文本左对齐
而假如文本由块级元素包裹,则绝对定位图片水平方向上位于demo容器的50%宽度处(并不是水平居中)。
http://bbs.cssworld.cn/forum.php?mod=image&aid=101&size=300x300&key=95800728a317fcee&nocache=yes&type=fixnone
http://bbs.cssworld.cn/forum.php?mod=image&aid=102&size=300x300&key=fdceb97b8897fb70&nocache=yes&type=fixnone
http://bbs.cssworld.cn/forum.php?mod=image&aid=103&size=300x300&key=3e0f1080fc6a9310&nocache=yes&type=fixnone
http://bbs.cssworld.cn/forum.php?mod=image&aid=104&size=300x300&key=7c99abdca343ca95&nocache=yes&type=fixnone

从表现上看并不是完全像文中所说的那样稳定,对于这种现象该怎么解释?

admin 发表于 2018-8-28 11:14:58

我怎么觉得你的这些截图正好佐证了绝对定位元素的相对定位特性呢?
页: [1]
查看完整版本: 6/5-4例子在样式上的疑惑