微信小程序如何使用open-data更改头像显示样式

这篇文章主要介绍微信小程序如何使用open-data更改头像显示样式，文中介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们一定要看完！

代码如下：

4. 

7. 东辰-寒冰

8. 来自虎牙直播

11. 关注

1. /*主播信息 */

2. .zhubo{

3. margin: 0 28rpx 0;

4. height: 144rpx;

5. display:flex;

6. justify-content:space-between;

7. align-items: center;

8. }

9. .zhuboIcon{

10. width:80rpx;

11. height: 80rpx;

12. border-radius: 50%;

13. overflow: hidden;

14. }

15. .zhuboLeft{

16. display: flex;

17. }

18. .zhubo-avater{

19. padding-right: 20rpx;

20. display: flex;

21. align-items: center;

22. }

23. .zhubo-name{

24. font-weight: 700;

25. }

26. .zhubo-from{

27. color: #A6A6A6;

28. }

效果二：

1. .userinfo {

2. position: relative;

3. width: 750rpx;

4. height: 320rpx;

5. color: #fff;

6. display: flex;

7. flex-direction: column;

8. align-items: center;

9. }

10. .userinfo-avatar {

11. overflow:hidden;

12. display: block;

13. width: 160rpx;

14. height: 160rpx;

15. margin: 20rpx;

16. margin-top: 50rpx;

17. border-radius: 50%;

18. border: 2px solid #fff;

19. box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.2);

20. }

21. .userinfo{

22. /* color: #fff; */

23. font-size: 14px;

24. background-color: #c0c0c0;

25. border-radius:40%;

26. }

以上是"微信小程序如何使用open-data更改头像显示样式"这篇文章的所有内容，感谢各位的阅读！希望分享的内容对大家有帮助，更多相关知识，欢迎关注行业资讯频道！