html – 变换比例在Safari上表现得很奇怪
发布时间:2021-05-15 20:10 所属栏目:12 来源:网络整理
导读:我使用Bootstrap 3创建了一个网站.Bootstrap 3包含平面三角形作为glyphicons.但是图标是平的,所以我使用我的拉伸类拉伸它们: .stretch { display: inline-block; transform: scale(3,2); /* W3C */ -webkit-transform: scale(3,2); /* Safari and Chrome */
我使用Bootstrap 3创建了一个网站.Bootstrap 3包含平面三角形作为glyphicons.但是图标是平的,所以我使用我的拉伸类拉伸它们: .stretch { display: inline-block; transform: scale(3,2); /* W3C */ -webkit-transform: scale(3,2); /* Safari and Chrome */ -moz-transform: scale(3,2); /* Firefox */ -ms-transform: scale(3,2); /* IE 9 */ -o-transform: scale(3,2); /* Opera */ } 它工作得很好,但如果我使用Safari 5,图标看起来很奇怪.(抱歉,我无法直接上传图片). glyphicon的类是: .glyphicon { position: relative; top: 1px; display: inline-block; font-family: 'Glyphicons Halflings'; font-style: normal; font-weight: normal; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } 我已经在body类中尝试了这个: -webkit-transform: translateZ(0px); 我希望你能帮助我,谢谢! 解决方法模糊缩放是Safari: https://bugs.webkit.org/show_bug.cgi?id=27684中的一个错误要解决此问题,您可以尝试使用font-size“缩放”glyphicon,然后使用transform:scale将其缩小.缩小比例可以给你更好的结果. 还有 (编辑:ASP站长网) |
相关内容
网友评论
推荐文章
热点阅读