css transform scale不缩放父元素

yv5phkfx  于 11个月前  发布在  其他
关注(0)|答案(3)|浏览(320)

我有一个链接2图像,我特灵将它们缩小到原始图像大小的50%,每个图像有不同的大小
如果我添加了一个后边框,我可以看到,图像是正确的比例缩小到一半大小,但一个tog是在原来的大小
我也使用bootstrap 3在这个页面

.header-tit-logos a {
    display: inline-block;
}
    
.header-tit-logos img {
    -ms-transform: scale(0.5);
    -webkit-transform: scale(0.5);
    transform: scale(0.5);      
}

个字符

rseugnpd

rseugnpd1#

来自@Paulie_D的评论似乎是正确的,也是我想要的简单答案:
transform:scale()是一个完全视觉效果。它实际上不会改变元素的大小。

jfgube3f

jfgube3f2#

你不能从一个子应用样式到一个父。在你的例子中,你可以尝试缩放父。它将缩放父和子

.header-tit-logos {
-ms-transform: scale(0.5);
-webkit-transform: scale(0.5);
transform: scale(0.5);      
 }

字符串

2jcobegt

2jcobegt3#

尝试从img标签中删除width和height。

.header-tit-logos a {
    background:red;
    display: inline-block;
}

.header-tit-logos img {
    -ms-transform: scale(0.5);
    -webkit-transform: scale(0.5);
    transform: scale(0.5);      
}

个字符

相关问题