本文介绍了CSS变换比例，不缩放子元素(&A；T)的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
如果我有一个带有几个子元素的div，并且它正在进行CSS变换缩放。我有一个不想缩放的子元素
#parent{
-webkit-transform: scale(.5);
}
span:last-child{
-webkit-transform: Something to ignore the parent scale;
}<div id="parent">
<span>Child 1</span>
<span>Child 2</span>
<span>Child 3 (Don't Scale Me)</span>
</div>这是否可以仅使用CSS来完成？而不更改html或使用js。
推荐答案
遗憾的是，这是不可能的。
不过，您大致有两个其他选择：
- 缩放所有其他元素，不包括您不想缩放的元素(但这不会缩放容器)。
- 缩放容器并重新缩放您不想缩放的元素(但这可能会使其看起来模糊)。
示例：
// Example 1.
span:not(:last-child) {
display: inline-block; /* You can't scale inline elements */
transform: scale(2);
}
// Example 2.
#parent{
transform: scale(.5);
}
span:last-child{
transform: scale(2);
}
这篇关于CSS变换比例，不缩放子元素(&A；T)的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持编程学习网！
本站部分内容来源互联网,如果有图片或者内容侵犯您的权益请联系我们删除！