html - 应用 CSS 变换时影响其他元素 : scale

标签 html css scale css-transforms

我在一个页面上有三个 div,它们并排 float 。使用 css scale 方法,我将最中间的 div 缩放到 0.5。这很好用。

唯一的问题是缩放 div 不会影响其他 div 的位置。看起来缩放后的 div 仍然有一个带有原始比例的不可见容器。期望的结果是缩放后边距保持不变。

我添加了一个示例:http://jsfiddle.net/yxYdd/3/ (实际上,最中间的 div 填充了许多其他元素)

有没有一种巧妙的方法,不会弄乱边距等,以便缩放会影响其他 div 的定位?

最佳答案

不幸的是,这正是 CSS 2D 转换设计的方式。

您真正想要做的是避免在此示例中使用 CSS 转换,而是使用另一个更简单的实现。

我在这里为您完成了此操作:http://jsfiddle.net/yxYdd/4/

您真正需要的唯一改变是:

.scaleDiv{
    width:75px;
}

这确实会产生您想要的效果。这不是很好笑吗? :)

关于html - 应用 CSS 变换时影响其他元素 : scale,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10723647/

相关文章:

按大因子缩放大数和按小因子缩放小数的算法

css - SVG 作为背景图像未出现

javascript - 当页面加载到特定的 div ID 时如何触发 javascript?

html - 将 <br> 与显示 : inline-block. 一起使用是不好的做法吗?

html - Bootstrap/网格系统/CSS 解决方法

javascript - 反转有序列表的编号顺序

javascript - 如何检查给定变量输入的小数点右移次数?

html - 如何使用 HTML 或 jQuery 代码禁用 INPUT 上的 Chrome 拼写检查?

python - 在pycharm中连接html文件和css文件

html - Bootstrap 用颜色填充整个列