/**index.wxss**/ @box-shadow: 0 0 6px rgba(0, 0, 0, 0.25); image { width: 100%; height: 100%; } .displex-flex { display: flex; } .box-border-radius { border-radius: 10px; overflow: hidden; } .goods-cover{ border-radius: 4px; overflow: hidden; } .content-bg { background: linear-gradient(to bottom, #ceb17f 60%, #fff); } // swiper .top-swiper { .box-border-radius; } .swiper-item { height: 150px; } .index-act-1 { width: 100%; height: 100px; .box-border-radius; box-shadow: @box-shadow; margin: 20px 0; } .recommend-wrapper, .hot-wrapper { margin: 20px 0; } .hot-title { font-weight: bold; font-size: 16px; margin-bottom: 10px; } // panel .panel { .box-border-radius; box-shadow: @box-shadow; .panel-title { font-weight: bold; font-size: 16px; padding: 20px 20px 0; } .panel-body { padding: 20px; } } .goods-list-row { display: flex; overflow: hidden; .goods-item { flex: 1; min-width: 20%; margin-right: 10px; text-align: center; &:last-child { margin-right: 0px; } } .image { width: 100%; // 长宽的比例 aspect-ratio: 1/1; .goods-cover; } .title { word-break: break-all; font-size: 12px; line-height: 16px; height: 32px; overflow: hidden; margin-top: 5px; } .price { color: #f00; margin-top: 5px; } } .normal-list { .goods-item { .displex-flex; margin-bottom: 20px; &:last-child { margin-bottom: 0; } } .image { min-width: 80px; height: 80px; margin-right: 15px; .goods-cover; } .goods-info{ flex:1; } .title { line-height: 20px; height: 40px; overflow: hidden; font-size: 14px; word-break: break-all; } .goods-action { margin-top: 10px; .displex-flex; justify-content: space-between; } .price { color: red; font-size: 16px; line-height: 30px; } .actions { button { height: 30px; border-radius: 30px; font-size: 13px; background-color: rgba(255, 0, 0, 0.8); color: white; width: 100px; padding: 0; line-height: 30px; &:active{ background-color: rgb(233, 0, 0); } } } }