ThorUI_echo
ThorUI_echo
  • 发布:2016-09-28 14:59
  • 更新:2016-09-28 14:59
  • 阅读:1944

关于0.5px细线问题

分类:MUI

对比了一下android和ios ,android上细线效果明显,ios上不行,几乎没效果, 以下是官方的处理:

.mui-table-view-cell:after  
{  
    position: absolute;  
    right: 0;  
    bottom: 0;  
    left: 15px;  

    height: 1px;  

    content: '';  
    -webkit-transform: scaleY(.5);  
            transform: scaleY(.5);  

     background-color: #c8c7cc;  
}

我简单做了一下修改:

一:渐变(部分android机好像不支持)

.mui-table-view-cell:after  
{  
    position: absolute;  
    right: 0;  
    bottom: 0;  
    left: 15px;  

    height: 1px;  

    content: '';  
    background-image: -webkit-linear-gradient(0deg, #c8c7cc 50%, transparent 50%);  
  background-image: linear-gradient(0deg, #c8c7cc 50%, transparent 50%);  
}

二、我看了一下京东的,修改如下:

  position: absolute;  
    right: 0;  
    bottom: 0;  
    left: 15px;  

    height: 1px;  

    content: '';  
    -webkit-transform: scaleY(.5);  
            transform: scaleY(.5);  

    border-top:1px solid #c8c7cc;  
}
0 关注 分享

要回复文章请先登录注册