html5 - 为什么在使用svg做图标时,图标边缘总是会被砍掉一点
大家讲道理
大家讲道理 2017-04-17 11:09:43
[HTML讨论组]


这个图标的原始尺寸是64*64px,第一张图是在retina屏幕上图标显示的截图,第二张是设计图。

图标的尺寸如下

svg.icon{
    font-size: 2.142857142857143rem;
    width:1em;
    height:1em;
}

html{
    font-size: 15.296875px;
}

网页在运行的时候首先会由屏幕高度计算出一个font-size值,然后设置给html。页面中每个元素都以rem作为单位,用这样的方式来实现等比放大缩小。

但是在不同屏幕下很多图标左边或者下面都会有不同程度被砍掉的现象。

firefox,safari和ie11都没问题,就chrome出毛病。
why?

大家讲道理
大家讲道理

光阴似箭催人老,日月如移越少年。

全部回复(1)
高洛峰

ai画板的位置和尺寸是整数吗?

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习
PHP中文网抖音号
发现有趣的

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号