css3 transform transition 配合缩放,字体大小变化的问题 ? 财富值47

2016-10-12 11:33发布

.hoverMenu{     -webkit-transition:all 0.1s;     -moz-transition:all 0.1s;     -o-transition:all 0.1s;     transition:all 0.1s; }  .hoverMenu:hover{     -webkit-transform: scale(1.2);     -moz-transform:scale(1.2);     -o-transform:scale(1.2);     transform:scale(1.2); }

鼠标移动到这个div上面的时候,字体会变细变宽,最后正常 ? 如何防止这种问题 ?

scale() 这个属性会影响字体 ? 如何不让字体受到影响

这种方式确实还是有问题,通过绝对定位还是可以实现但是麻烦,所以还是通过jquery最好了.

5条回答

你把transition里面的all改成具体要变化的属性 all的意思是改变所有

.hoverMenu:hover .font{transform:scale(1);},
.font是你不想变大的文字的一个类,把它的放大倍数为1(不变)试下

font-stretch:normal;
去掉就行了。。

前几天看到百度网页,是把字体先放大在缩回原来的大小.效果还挺理想

字体变大不关all的事情,transition:all 0.1s;这只是过度时间

一周热门 更多>