html - css 为什么改了改 postion 出现这个结果?
本文介绍了html - css 为什么改了改 postion 出现这个结果?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
问 题
.boxSon
{
position:absolute;
top:50%;
left:50%;
border:black solid 1px;
transform:translate(-50%,-50%);
-moz-transform:translate(-50%,-50%);
-ms-transform:translate(-50%,-50%);
-webkit-transform:translate(-50%,-50%);
-o-transform:translate(-20%,-50%);
}
这是字的代码:
把 position:absolute; 改成 position:relative 后效果成了下面这样:
.boxSon
{
position:relative;
top:50%;
left:50%;
border:black solid 1px;
transform:translate(-50%,-50%);
-moz-transform:translate(-50%,-50%);
-ms-transform:translate(-50%,-50%);
-webkit-transform:translate(-50%,-50%);
-o-transform:translate(-20%,-50%);
}
我一直以为 position:relative; 就是改下坐标系,
偏移点,但是这里居然这么大不一样.
谁能简单给我讲讲为什么????
解决方案
隐式类型转换,absolute的时候div为inline-block,relative的时候为block
这篇关于html - css 为什么改了改 postion 出现这个结果?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文