小程序怎么做圆角头像

 时间:2024-10-15 07:31:04

1、首先准备一个小程序的目录结构,如下图所示

小程序怎么做圆角头像

2、然后将图片拷贝进去,如下图所示

小程序怎么做圆角头像

3、接着在wxml中显示图片,如下图所示

小程序怎么做圆角头像

4、我们可以看到左侧的显示是正方形的,如下图所示

小程序怎么做圆角头像

5、然后我们进入一个border-radius属性,值为50%

小程序怎么做圆角头像

6、这个时候圆角就出来了,如下图所示,因为我的是长方形的图片所以是椭圆

小程序怎么做圆角头像

7、综上所述,小程序中制作圆角头像就用border-radius,你学会了码

  • IntelliJ IDEA怎么代码编辑器移动显示两个窗口
  • notability怎样添加分配器
  • 计算机组成原理运算器的微程序实验和独立实验结果一样吗
  • 如何获取历年 GDP 数据并展示?
  • 如何打开Android Studio最近使用项目?
  • 热门搜索
    洛阳市旅游景点 环巢湖旅游大道 纯玩旅游 湘西旅游景点大全 名古屋旅游攻略 重庆市旅游景点大全 松山湖旅游攻略 韶关南雄旅游攻略 暑假旅游攻略 西安旅游职业中专