任何使用CSS一段时间的人都会了解绝对和相对定位的优点。回顾：
位置：亲戚允许元素从其原始位置（使用左或右）或垂直（使用顶部或底部）转移。
位置：绝对允许使用左，右，顶部或底部的元素相对于包含块的元素定位
（包含块是最接近的祖先节点，其位置是相对，绝对或固定的位置）。
因此，定位节点很简单，例如
html：
<div > <div ></div> </div>
#outer
{
position: relative;
width: 200px;
height: 200px;
margin: 20px auto;
border: 2px solid #c00;
}
#inner
{
position: absolute;
left: 50px;
top: 50px;
width: 96px;
height: 96px;
background-color: #ddc;
border: 2px solid #00c;
}
#inner
{
position: absolute;
left: 50px;
right: 50px;
top: 50px;
bottom: 50px;
background-color: #ddc;
border: 2px solid #00c;
}
// expands and contracts the inner box
window.onload = function() {
var inner = document.getElementById("inner");
var offset = 100, dir = -1;
setInterval(function() {
inner.style.left = inner.style.right = inner.style.top = inner.style.bottom = offset+"px";
offset += dir;
if (offset == 0 || offset == 100) dir = -dir;
}, 10);
}
中起作用，CSS中的“位置：绝对”属性从正常文档流中删除元素，并将其定位在指定位置相对于其最接近的位置祖先或对初始包含的块。可以使用“顶部”，“右”，“底部”和“左”属性四处移动定位的元素。但是，如果没有“静态”以外的祖先元素具有其他位置，则使用最初的包含块。这些属性仅对定位元素有影响。他们指定元素和其包含元素的一个或多个侧面之间的距离。例如，“顶部：20px”是指元素的顶部边缘距其包含元素的顶部边缘20px。首先，将“左：50％”设置为将元素的左边缘移至父母的中心。然后，使用“变换：translatex（-50％）”将元素拉回其自身宽度的左侧一半，有效地将其归为中心。
> css如何处理重叠元素？
使用“ z index”属性重叠元素。此属性指定元素的堆栈顺序，该元素是其在z轴上的位置。具有较高“ Z index”的元素将显示在元素的前面，较低的“ z index”。> CSS中的初始包含块是什么？css中的初始包含块是包含块的块中的块（html）居住在哪个块中。它通常是浏览器窗口的视口，但是如果根元素的“溢出”属性不是“可见的”，也可以是页面框。
>>
>我如何使元素保持其长宽比，因为它重新调整了？
以上是CSS中绝对元素尺寸的两种方式的详细内容。更多信息请关注PHP中文网其他相关文章！
