App里面如何正确显示用户头像

Posted 九转功成

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了App里面如何正确显示用户头像相关的知识,希望对你有一定的参考价值。

1、说明,一般用户头像在上传的时候都会处理为正方形,如果没有处理该怎么正确显示用户头像呢?
解决方案:用css强制

在线地址移动端:戳这里

<div class="main-meimg"><img src="http://playback-langlive.ufile.ucloud.com.cn/c8f137446774494db18e41839c4a788f.jpg" alt=""></div>

css

.main-meimg {
    width: 2.08rem;
    margin: 0 auto;
    height: 2.08rem;
    border: 0.06rem solid #B37DFD;
    border-radius: 50%;
    padding: 0.08rem;
    box-shadow: inset 0 0 0.133333rem #B37DFD;
    position: relative;
}
.main-meimg img {
    width: auto;
    height: 100%;
    position: absolute;
    left: -100%;
    top: -100%;
    right: -100%;
    bottom: -100%;
    margin: auto;
    border-radius: 50%;
}

 

以上是关于App里面如何正确显示用户头像的主要内容,如果未能解决你的问题,请参考以下文章

App 的一种头像缓存策略

局域网discuz无法显示头像

Vue App 不显示反应器链接片段

如何显示用户头像

使用ivx画布组件打印微信头像的经验总结

如何在目标 c 中使用 xmpp 框架显示用户头像图像?