效果
项目结构
index.wxml
wxml里很简单,核心东西都在index.wxss中。
<view class="body">
<!-- 头部 -->
<view class="head">
<view class="head_bar active">推荐</view>
<view class="head_bar">精品</view>
<view class="head_bar">排行榜</view>
</view>
<!-- 中间内容 -->
<view class="list-wrap">
<scroll-view scroll-y="true" class="list">
<view class="list-scroll">
<view class="card">
<image src="../img/2.jpg" mode="widthFix"></image>
<view class="introduction">星空之美</view>
<view class="price">免费</view>
</view>
<view class="card">
<image src="../img/2.jpg" mode="widthFix"></image>