From 2f12c3456ab5fc124e8495a0ea1f6095e5fadac6 Mon Sep 17 00:00:00 2001 From: taiyuan Date: Fri, 10 Sep 2021 11:37:09 +0800 Subject: [PATCH] 分类列表风格二样式修改 --- pages/goods/categoryList/categoryList.wxml | 10 +++++----- pages/goods/categoryList/categoryList.wxss | 70 ++++++++++++++++++++++++++++++++++------------------------------------ 2 files changed, 39 insertions(+), 41 deletions(-) diff --git a/pages/goods/categoryList/categoryList.wxml b/pages/goods/categoryList/categoryList.wxml index 1aa69f1..70965e1 100644 --- a/pages/goods/categoryList/categoryList.wxml +++ b/pages/goods/categoryList/categoryList.wxml @@ -122,9 +122,9 @@ - + - + @@ -159,7 +159,7 @@ - + @@ -297,7 +297,7 @@ - + @@ -345,7 +345,7 @@ - + diff --git a/pages/goods/categoryList/categoryList.wxss b/pages/goods/categoryList/categoryList.wxss index c57818b..fd612a1 100644 --- a/pages/goods/categoryList/categoryList.wxss +++ b/pages/goods/categoryList/categoryList.wxss @@ -1,6 +1,6 @@ /*---nyf 2018-9-7---*/ -page{height: 100%; background: #fff;} +page{height: 100%; background: #fff;padding-top:120rpx;box-sizing: border-box;} .top_view{ width: 100%;background: #fff;} .swiper-tab{ @@ -103,7 +103,7 @@ line-height: 50rpx; /*--国家--*/ .nation_box{ position: absolute;width: 260rpx; height: 160rpx; background-size: 100% 100%; background-repeat: no-repeat; - top:110rpx;left: 50%; margin-left: -130rpx;z-index: 8; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAN8AAACACAYAAACLIbwOAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoV2luZG93cykiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6MkVDREM1NjhCMDU3MTFFNjg3NEZDNzlCNDg1N0FGRjUiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6MkVDREM1NjlCMDU3MTFFNjg3NEZDNzlCNDg1N0FGRjUiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDoyRUNEQzU2NkIwNTcxMUU2ODc0RkM3OUI0ODU3QUZGNSIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDoyRUNEQzU2N0IwNTcxMUU2ODc0RkM3OUI0ODU3QUZGNSIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PlO56qEAAAFJSURBVHja7NfRCYAgFIbRDMd0Doe4a9ietxWUIjDOeZYefvhIS2aOA/jcaQIQH4gPEB+IDxAfiA8QH2ynzhyKiGYqWNN7vx7HN/MhYO2H5doJ3nwgPkB8ID5AfCA+QHwgPkB8ID5AfCA+EJ8JQHwgPkB8ID5AfCA+QHwgPkB8ID5AfCA+EB8gPhAfID4QHyA+EB8gPhAfID4QHyA+EB+IDxAfiA8QH4gPEB+IDxAfiA8QH4gPEB+ID8QHiA/EB4gPxAeID8QHiA/EB4gPxAeID8QH4gPEB+IDxAfiA8QH4gPEB+IDxAfiA8QH4gPxAeID8QHiA/EB4gPxAeID8QHiA/EB4gPxgfgA8YH4APGB+ADxgfgA8YH4APGB+ADxgfhAfID4QHyA+OB/6uzBiGjmgveUzBxmANdOEB8gPhAfID4QHyA+2MotwAD/ZBI/EDK5cgAAAABJRU5ErkJggg==");} + top:110rpx;left: 50%; /* margin-left: -130rpx; */z-index: 8; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAN8AAACACAYAAACLIbwOAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoV2luZG93cykiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6MkVDREM1NjhCMDU3MTFFNjg3NEZDNzlCNDg1N0FGRjUiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6MkVDREM1NjlCMDU3MTFFNjg3NEZDNzlCNDg1N0FGRjUiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDoyRUNEQzU2NkIwNTcxMUU2ODc0RkM3OUI0ODU3QUZGNSIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDoyRUNEQzU2N0IwNTcxMUU2ODc0RkM3OUI0ODU3QUZGNSIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PlO56qEAAAFJSURBVHja7NfRCYAgFIbRDMd0Doe4a9ietxWUIjDOeZYefvhIS2aOA/jcaQIQH4gPEB+IDxAfiA8QH2ynzhyKiGYqWNN7vx7HN/MhYO2H5doJ3nwgPkB8ID5AfCA+QHwgPkB8ID5AfCA+EJ8JQHwgPkB8ID5AfCA+QHwgPkB8ID5AfCA+EB8gPhAfID4QHyA+EB8gPhAfID4QHyA+EB+IDxAfiA8QH4gPEB+IDxAfiA8QH4gPEB+ID8QHiA/EB4gPxAeID8QHiA/EB4gPxAeID8QH4gPEB+IDxAfiA8QH4gPEB+IDxAfiA8QH4gPxAeID8QHiA/EB4gPxAeID8QHiA/EB4gPxgfgA8YH4APGB+ADxgfgA8YH4APGB+ADxgfhAfID4QHyA+OB/6uzBiGjmgveUzBxmANdOEB8gPhAfID4QHyA+2MotwAD/ZBI/EDK5cgAAAABJRU5ErkJggg==");} .n_img{width: 100%; height: 375rpx;} .nt_1{height:82rpx; line-height: 100rpx;} @@ -177,7 +177,7 @@ line-height: 50rpx; height: 120rpx; z-index: 10; background: #fff; - border-top: 4rpx solid #eee; + /* border-top: 4rpx solid #eee; */ border-bottom: 1rpx solid #eee; } @@ -212,13 +212,14 @@ margin-top: 8rpx; } .project_type{ + box-sizing: border-box; width: 26%; height: 100%; + padding-bottom: 100rpx; border-right: 1rpx solid #eee; white-space: nowrap; -overflow: hidden; -overflow-y: scroll; - + overflow: hidden; + overflow-y: scroll; } .share_type{ margin: auto; @@ -301,20 +302,17 @@ width: 60%; } .classify_content{ - width: 72% + width: 100% } - .classify_content-frame{ - width: 90%; - margin: auto; - flex-wrap:wrap; - max-height: 90%; - overflow-y:scroll; - overflow: hidden scroll; - /* padding-bottom: 65rpx; */ - - - } + .classify_content-frame{ + box-sizing: border-box; + width: 100%; + padding: 0 20rpx; + flex-wrap:wrap; + overflow-y:scroll; + padding-bottom: 118rpx; + } .country_img-frame{ width: 48%; height: 140rpx; @@ -331,12 +329,12 @@ width: 60%; } .nation_box.box{ - top: 16%; -width:80%; -height:70%; -left: 70.5%; -overflow: hidden; - + width:80%; + height:70%; + top: 50%; + left: 50%; + overflow: hidden; + transform: translate(-50%, -50%); } .nt_1.line-height{ line-height: 65rpx; @@ -363,10 +361,10 @@ line-height: 65rpx; font-size: 24rpx; } .brand_img_frame{ - width: 45%; + width: 50%; margin-top: 18rpx; - margin-right: 15rpx; - height: 160rpx; + /* margin-right: 15rpx; */ + height: 160rpx; } .brand_img{ width:220rpx; @@ -375,13 +373,12 @@ line-height: 65rpx; margin-top: 10rpx; } - .type_img_frame{ - width: 30%; + .type_img_frame { + width: calc(100% / 3); height: 140rpx; - margin-top: 18rpx; - margin-right: 15rpx; - - + margin-top: 20rpx; + margin-bottom: 20rpx; + /* margin-right: 15rpx; */ } @@ -504,7 +501,8 @@ margin: auto; border-left: 8rpx solid #E41F19; height: 50rpx; left: 0; - top:26rpx; + top:50%; + transform: translateY(-50%); } @@ -519,8 +517,8 @@ margin: auto; } page { - overflow-x: hidden; - padding-bottom: 40rpx; + /* overflow-x: hidden; */ + /* padding-bottom: 40rpx; */ } /* 风格三商品列表样式引入 */ -- libgit2 0.21.4