前言
由于最近这段时间几乎全身心投入到了毕设里面，博客更新频率相较寒假期间明显降低了不少。
今天记录一下刚刚解决的新版电脑120网站左上角Logo在火狐浏览器中兼容性问题的过程，以便后续遇到类似问题时加以参考。
描述
经查阅资料得知CSS中的zoom属性在火狐浏览器中是不受支持的：
修复前在火狐浏览器的呈现效果：
修复后在火狐浏览器中的呈现效果：
修复
用这段CSS：
zoom: 1.8;
-moz-transform: scale(1.8);
-moz-transform-origin: 0 0;代替第一次写的这段CSS：
zoom: 1.8;其中：
-moz-代表firefox浏览器私有属性-ms-代表ie浏览器私有属性-webkit-代表safari、chrome私有属性-o-代表Opera
此外，在使用transform方法进行文字或图像的变形时，是以元素的中心点为基准点进行的，
使用
transform-origin属性，可以改变变形的基准点。用法：
transform-origin: 10px 10px;共两个参数，表示相对左上角原点的距离，单位
px，第一个参数表示相对左上角原点水平方向的距离，第二个参数表示相对左上角原点垂直方向的距离；两个参数除了可以设置为具体的像素值，其中第一个参数可以指定为
left、center、right，第二个参数可以指定为top、center、bottom。
这样一来就能畅快的在VR上看120网站了！^_^
参考资料：
https://blog.csdn.net/ff55fff/article/details/77674326
https://blog.csdn.net/qq_33821395/article/details/110069437
https://www.cnblogs.com/xiaoxingyiyi/articles/4838648.html
https://www.xiaojinzi.com/net/m1250769com
版权属于：soarli
本文链接：https://blog.soarli.top/archives/636.html
转载时须注明出处及本声明。
