84669 orang belajar
152542 orang belajar
20005 orang belajar
5487 orang belajar
7821 orang belajar
359900 orang belajar
3350 orang belajar
180660 orang belajar
48569 orang belajar
18603 orang belajar
40936 orang belajar
1549 orang belajar
1183 orang belajar
32909 orang belajar
demo在这 , https://jsfiddle.net/qk83j2wv/使用scale(0.5)缩小一个元素,但缩小后的元素还是占据原来元素的大小空间,怎样让那个元素缩小后的大小和所占据的空间一样大呢?
但外层元素还是以缩小前来布局的...
走同样的路,发现不同的人生
同是菜鸟,好像无解,但是可以定位缩放的点,transform-origin:left top,使用这个可以从左上角缩放,至于大小还是原始大小,给父元素加个overflow:hidden吧
transform是不会引起重排的,也就是说对元素进行缩放等操作不会影响到其他元素的布局,这样做动画之类的效果性能会更好。如果你要在缩放的同时改变元素的占据空间,那就用zoom做缩放。
transform
zoom
同大小透明p放到下面
希望对你有帮助
#d1 { width:200px; height:60px; border:1px solid red; transform-origin:left top; } #d1>span { display:block; font-size:32px; line-height:60px; background:#F90; }
内容 点我
内容
试试zoom缩小
理论上是无解的,这个要试着调整一下整体布局来达到你要的效果
纯CSS不会,囧。不过有一个思路,可以给一个父元素做为wrapper,然后用 JavaScript 计算出compute style的高和宽,再相应缩小为50%。
同是菜鸟,好像无解,但是可以定位缩放的点,transform-origin:left top,使用这个可以从左上角缩放,至于大小还是原始大小,给父元素加个overflow:hidden吧
transform
是不会引起重排的,也就是说对元素进行缩放等操作不会影响到其他元素的布局,这样做动画之类的效果性能会更好。如果你要在缩放的同时改变元素的占据空间,那就用zoom
做缩放。同大小透明p放到下面
希望对你有帮助
试试zoom缩小
理论上是无解的,这个要试着调整一下整体布局来达到你要的效果
纯CSS不会,囧。
不过有一个思路,可以给一个父元素做为wrapper,然后用 JavaScript 计算出compute style的高和宽,再相应缩小为50%。