资讯专栏INFORMATION COLUMN

border-radius:50%,在安卓上存在兼容问题

darkbug / 808人阅读

摘要:做移动端开发时为了做适配,通常采用作为单位,下面来写一个圆角相同的代码,有的是正圆,有的不是,,均显示正常解决方案单位改为但是这样做无法达到适配的目的设置图片使用既可以适配,即使再小的圆形也能在不同屏幕上完美展示

做移动端开发时为了做适配,通常采用rem作为单位,下面来写一个圆角

.round {
   width: 0.25rem;
    height: 0.25rem;
    border-radius: 50%;
    background: red;
}

相同的代码,有的是正圆,有的不是,ios,pc均显示正常

解决方案:

单位rem改为px, 但是这样做无法达到适配的目的

设置图片

使用svg, 既可以适配,即使再小的圆形也能在不同屏幕上完美展示


    

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/54874.html

相关文章

  • border-radius:50%安卓兼容问题

    摘要:做移动端开发时为了做适配,通常采用作为单位,下面来写一个圆角相同的代码,有的是正圆,有的不是,,均显示正常解决方案单位改为但是这样做无法达到适配的目的设置图片使用既可以适配,即使再小的圆形也能在不同屏幕上完美展示 做移动端开发时为了做适配,通常采用rem作为单位,下面来写一个圆角 .round { width: 0.25rem; height: 0.25rem; ...

    Joonas 评论0 收藏0
  • 安卓手机中rem单位border-radius:50%画圆变形的解决方案

    摘要:但是在安卓手机中会有变形的情况存在,渲染方面确实安卓手机干不过毕竟安卓版本众多,还有什么的线等等的坑,都是能完美运行,安卓总得找方法。当使用做单位,出来的圆是不会变形的,可能是安卓在计算过程中产生误差或者有什么其他因素造成的渲染问题。 罪魁祸首 i{ display inline-block width .08rem height .08r...

    RiverLi 评论0 收藏0
  • 安卓手机中rem单位border-radius:50%画圆变形的解决方案

    摘要:但是在安卓手机中会有变形的情况存在,渲染方面确实安卓手机干不过毕竟安卓版本众多,还有什么的线等等的坑,都是能完美运行,安卓总得找方法。当使用做单位,出来的圆是不会变形的,可能是安卓在计算过程中产生误差或者有什么其他因素造成的渲染问题。 罪魁祸首 i{ display inline-block width .08rem height .08r...

    elarity 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<