CSS使用transform-origin，解决transform: scale()后导致的页面元素位置偏移
warning:
这篇文章距离上次修改已过204天，其中的内容可能已经有所变动。
/* 假设有一个需要缩放的元素 */
.element {
/* 设置元素的基点进行变换 */
transform-origin: center center;
/* 应用缩放变换 */
transform: scale(0.8);
}
/* 在父元素中，可能需要调整定位或者大小来适应缩放后的变化 */
.parent-element {
/* 根据需要调整宽度和高度 */
width: 125px; /* 原始宽度的80% */
height: 125px; /* 原始高度的80% */
/* 如果子元素位置偏移，可能需要调整定位 */
position: relative;
top: -10px; /* 根据实际偏移进行调整 */
left: -10px; /* 根据实际偏移进行调整 */
}这个例子展示了如何使用transform-origin属性来设置变换的基点，以及如何在使用transform: scale()后调整父元素以适应布局变化。注意，实际的解决方案可能需要根据具体情况进行调整。
评论已关闭