下图是某商城商品分类页面，请按图片用html制作出如下页面，并将主要代码写在答卷上,并写出你的设计方法

上面那行字，设置属性text-derection为under-line这样就会有下划线....

下面菜单用一个DIV里面嵌套五个DIV。

每个DIV的宽高设置好。

第一个DIV的渐变效果代码略复杂，可以找个图做背景，商品分类和全部分类超链接设置属性disaplay为block，一个左浮动一个右浮动，行高属性（line-height）设置成与DIV的高度一直，这样垂直才会居中，下面的应该大同小异。

用DISAPLAY设置为BLOCK之后会变成块级元素，下面的超链接全都要设置成左浮动，像【家用电器】那样的，你可以直接打空格控制缩进距离，也可以调整左边距。。。

嗯。。。不懂可以继续问。。。本人大一，HTML学的还凑合

html 怎么循环商品列表？

<ulclass="goods_type_listclearfix">{%forskuinpage_skus%}<li><ahref={{url('goods:detail',kwargs={"sku_id":sku.id})}}><imgsrc="{{sku.default_image}}"></a><h4><ahref={{url('goods:detail',kwargs={"sku_id":sku.id})}}>{{sku.name}}</a></h4><divclass="operate"><spanclass="price">￥{{sku.price}}</span><spanclass="unit">台</span><ahref="#"class="add_goods"title="加入购物车"></a></div></li>{%endfor%}</ul>

你好，你提供了这么一串字符，这是网页上的代码。如果没有必要不要乱动的乱改呀！

vscode的easyless插件会自动生成index.wxss

主要是布局文件index.less的编写，注意less语法。

商品列表页功能：支持上拉加载更多，下拉刷新等

1，父组件（商品列表页）和子组件(Tabs组件)相互传递数据问题

2,上拉加载更多、下拉刷新实现的逻辑

---