微信小程序个人中心的列表控件实现代码

 更新时间:2020年04月26日 11:52:11   作者:wy313622821  
这篇文章主要介绍了微信小程序个人中心的列表控件实现代码,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下

个人中心的列表控件

首先来看效果图

在这里插入图片描述

wxml

<view class="list-item">
 <image class="item-image" src="../images/fuwu.png"></image>
 <text class="item-text">我的收藏</text>
 <image class="image-jiantou" src="../images/jiantou.png"></image>
 </view>
 <view class="line"></view>

wxss

.list-item {
 display: flex;
 flex-direction: row;
 align-items: center;
 width: 100%;
 height: 80rpx;
 margin-top: 10rpx;
 position: relative; /*父元素位置要设置为相对*/
}

.item-image {
 width: 50rpx;
 height: 50rpx;
 margin: 20rpx;
}

.item-text {
 color: gray;
 font-size: 35rpx;
 margin-left: 20rpx;
}

.image-jiantou {
 width: 20rpx;
 height: 35rpx;
 position: absolute; /* 要约束所在位置的子元素的位置要设置成绝对 */
 right: 0; /* 靠右调节 */
 margin-right: 35rpx
}

.line {
 width: 100%;
 height: 3rpx;
 background: lightgray;
 margin-left: 90rpx;
}

到此这篇关于微信小程序个人中心的列表控件实现代码的文章就介绍到这了,更多相关微信小程序个人中心内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • underscore之function_动力节点Java学院整理

    underscore之function_动力节点Java学院整理

    因为underscore本来就是为了充分发挥JavaScript的函数式编程特性,所以也提供了大量JavaScript本身没有的高阶函数。本文重点给大家介绍underscore之function知识,感兴趣的的朋友一起学习吧
    2017-07-07
  • js实现带农历和八字等信息的日历特效

    js实现带农历和八字等信息的日历特效

    本文主要介绍了js实现带农历和八字等信息的日历特效,小编觉得挺不错的,现在分享给大家,也给大家做个参考
    2016-05-05
  • 微信小程序自定义轮播图

    微信小程序自定义轮播图

    这篇文章主要为大家详细介绍了微信小程序自定义轮播图,swiper dots默认样式修改,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2018-11-11
  • JavaScript如何判断一个对象是空对象(附5种常见方法)

    JavaScript如何判断一个对象是空对象(附5种常见方法)

    在JavaScript中判断对象的类型是开发过程中的一个常见需求,尤其是在处理不确定类型的数据时,这篇文章主要介绍了JavaScript如何判断一个对象是空对象的相关资料,需要的朋友可以参考下
    2025-04-04
  • 如何让页面加载完成后执行js

    如何让页面加载完成后执行js

    本篇文章是对如何让页面加载完成后执行js的解决方法进行了详细的分析介绍,需要的朋友参考下
    2013-06-06
  • JavaScript DOM 添加事件

    JavaScript DOM 添加事件

    这是我在给库中添加事件的时候写的添加事件的方法!这个方法实现了跨浏览器之间的方法!
    2009-02-02
  • JS获取url参数,JS发送json格式的POST请求方法

    JS获取url参数,JS发送json格式的POST请求方法

    下面小编就为大家分享一篇JS获取url参数,JS发送json格式的POST请求方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2018-03-03
  • js实现文件上传表单域美化特效

    js实现文件上传表单域美化特效

    本文为大家分享的是一款效果非常酷的文件上传表单域美化特效。有7种不同的美化文件上传域的效果,很时尚,感兴趣的小伙伴们可以参考一下
    2015-11-11
  • JS定时器实现数值从0到10来回变化

    JS定时器实现数值从0到10来回变化

    最近做项目遇到一需求要求实现数值从0到10来回变化,下面小编给大家分享下实现代码,需要的朋友参考下
    2016-12-12
  • js+html5实现复制文字按钮

    js+html5实现复制文字按钮

    这篇文章主要为大家详细介绍了js+html5实现复制文字按钮,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-07-07

最新评论