微信小程序在线点餐外卖系统 毕业设计 课程设计（1）首页_基于微信小程序的值得买课程设计实现

{{item.myshijian}} {{item.mybiaoti}} 最新上架菜品 更多> {{item.cp_mingcheng}} 价格：¥ {{item.jiage}} 菜品排行 更多> {{item.cp_mingcheng}} {{item.jianjie}} No.{{index+1}} | 已销 {{item.yixiaoshou}} 件 | ¥ {{item.jiage}}

### wxss代码

/*广告图样式*/

.ad01 {
box-shadow: 0px 2px 2px gainsboro; /*阴影*/
margin: 2px; /*外边距*/
}

.ad01-img {
width: 100%;
}

/*轮播图样式*/
.slide-image {
height: 120px;
width: 100%;
display: inline-block;
overflow: hidden;
}

.slide-image2 {
height: 100%;
width: 100%;
display: inline-block;
overflow: hidden;
}

/*快捷菜单*/

.menu {
display: flex;
flex-wrap: wrap; /*换行*/
border-bottom: 1px solid gainsboro; /*菜单最下面线条*/
}

.menu-item {
width: 25%; /*1行4个菜单*/
padding: 5px; /*内边距*/
box-sizing: border-box;
display: flex;
justify-content: center; /*左右居中*/
flex-direction: column; /*从上到下*/
}

.menu-img {
width: 66%;
align-self: center;
}

.menu-mc {
font-size: 14px;
align-self: center;
}

.xinxi {
display: flex;
align-items: center;
padding: 5px;
border-bottom: 1px solid #f2f2f2;
}

.xinxi-icon {
width: 22px;
height: 22px;
}

.xinxi-text {
flex-grow: 1;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}

.xinxi-arrow {
width: 13px;
height: 13px;
}

/*区块标题*/

.qukuai {
display: flex;
background-color: aliceblue;
align-items: center;
}

.y01 {
width: 3px;
height: 18px;
background-color: green;
margin: 5px;
box-shadow: 2px 2px 2px gainsboro;
}

.t01 {
color: gray;
flex-grow: 1;
text-shadow: 1px 1px 1px gainsboro;
}

.m01 {
color: gray;
margin-right: 5px;
text-shadow: 2px 2px 2px gainsboro;
}

.zuixin {
display: flex;
flex-wrap: wrap;
}

.zuixin-item {
width: 50%;
display: flex;
flex-direction: column;
padding: 5px;
box-sizing: border-box;
border-bottom: 1px dotted gainsboro;
}

.zuixin-img {
width: 100%;
border: 1px solid #fcfafa;
border-radius: 5px;
box-shadow: 0px 2px 2px gainsboro;
padding: 5px;
box-sizing: border-box;
}

.zuixin-mc {
font-size: 12px;
padding: 3px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}

.zuixin-jiage0 {
font-size: 10px;
padding: 3px;
color: red;
}

.zuixin-jiage1 {
font-size: 14px;
padding: 3px;
color: red;
}

.zuixin-jiage2 {
font-size: 11px;
padding: 3px;
color: gray;
}

/*销售排行*/

.paihang-item {