page{ min-height: 100%; background-color: #fff; } .container{ min-height: 100%; background-color: #fff; } .search-layout { position: fixed; top: 0; z-index: 99999; background: #fff; left: 0; right: 0; } .search-header{ height: 91rpx; padding: 16rpx 0; font-size: 29rpx; margin-left: 46rpx; margin-right: 46rpx; color: #333; display: flex; align-items: center; } .search-header .input-box{ flex: 1; position: relative; height: 80rpx; border-radius: 4px; line-height: 80rpx; padding: 0 20rpx; background: #fff; border: 1px solid rgba(0,0,0,0.1); border-radius: 40rpx; } .search-header .icon{ position: absolute; top: 50%; transform: translateY(-50%); left: 20rpx; width: 26rpx; height: 26rpx; } .search-header .del{ position: absolute; top: 3rpx; right: 10rpx; width: 53rpx; height: 53rpx; z-index: 10; } .search-header .keywrod{ position: absolute; top: 0; left: 40rpx; right: 0; height: 100%; padding: 0 20rpx 0 30rpx; } .search-header .right{ margin-top: 24rpx; margin-left: 31rpx; margin-right: 6rpx; width: 58rpx; height: 43rpx; line-height: 43rpx; float: right; } .search-header .quit { flex: 0 0 auto; padding-left: 46rpx; font-size: 28rpx; color: #131D34; font-weight: 400; } .no-search{ height: auto; overflow: hidden; margin-top: 100rpx; } .serach-keywords{ background: #fff; width: 750rpx; height: auto; overflow: hidden; margin-bottom: 20rpx; padding: 0 46rpx; } .serach-keywords .h{ display: block; margin: 22rpx 0 20rpx; font-weight: bold; width: 100%; color: #131D34; font-size: 26rpx; overflow: hidden; } .serach-keywords .title{ float: left; display: block; width: 120rpx; height: 55rpx; line-height: 55rpx; } .serach-keywords .icon{ float: right; display: block; height: 55rpx; width: 55rpx; } .serach-keywords .b{ height: auto; overflow: hidden; } .serach-keywords .item{ display: inline-block; width: auto; padding: 4rpx 26rpx; background:rgba(247,247,247,1); margin: 0 31.25rpx 31.25rpx 0; font-size: 22rpx; line-height: 32rpx; color:rgba(19,29,52,1); border-radius: 20rpx; } .serach-keywords .item.active{ color: #b4282d; border: 1px solid #b4282d; } .shelper-list{ width: 750rpx; height: auto; overflow: hidden; background: #fff; padding: 0 31.25rpx; } .shelper-list .item{ height: 93rpx; width: 687.5rpx; line-height: 93rpx; font-size: 24rpx; color: #333; border-bottom: 1px solid #f4f4f4; } .sort{ position: fixed; top: 90rpx; background: #fff; width: 100%; height: 78rpx; z-index: 9999; } .sort-box{ background: #fff; width: 100%; height: 78rpx; overflow: hidden; padding: 0 30rpx; display: flex; border-bottom: 1px solid #d9d9d9; } .sort-box .item{ height: 78rpx; line-height: 78rpx; text-align: center; flex:1; color: #333; font-size: 30rpx; } .sort-box .item .txt{ display: block; width: 100%; height: 100%; color: #333; } .sort-box .item.active .txt{ color: #b4282d; } .sort-box .item.by-price{ background: url(//yanxuan.nosdn.127.net/hxm/yanxuan-wap/p/20161201/style/img/icon-normal/no-3127092a69.png) 155rpx center no-repeat; background-size: 15rpx 21rpx; } .sort-box .item.by-price.active.asc{ background: url(http://yanxuan.nosdn.127.net/hxm/yanxuan-wap/p/20161201/style/img/icon-normal/up-636b92c0a5.png) 155rpx center no-repeat; background-size: 15rpx 21rpx; } .sort-box .item.by-price.active.desc{ background: url(http://yanxuan.nosdn.127.net/hxm/yanxuan-wap/p/20161201/style/img/icon-normal/down-95e035f3e5.png) 155rpx center no-repeat; background-size: 15rpx 21rpx; } .sort-box-category{ background: #fff; width: 100%; height: auto; z-index: 9999; overflow: hidden; padding: 40rpx 40rpx 0 0; border-bottom: 1px solid #d9d9d9; position: relative; } .sort-box-category .item{ height: 54rpx; line-height: 54rpx; text-align: center; float: left; padding: 0 16rpx; margin: 0 0 40rpx 40rpx; border: 1px solid #666; color: #333; font-size: 24rpx; } .sort-box-category .item.active{ color: #0075DC; border: 1px solid #0075DC; } .cate-item{ margin-top: 180rpx; height: auto; overflow: hidden; } .cate-item .h{ height: 145rpx; width: 750rpx; display: flex; flex-direction: column; align-items: center; justify-content: center; } .cate-item .h .name{ display: block; height: 35rpx; margin-bottom: 18rpx; font-size: 30rpx; color: #333; } .cate-item .h .desc{ display: block; height: 24rpx; font-size: 24rpx; color: #999; } .cate-item .b{ width: 750rpx; padding: 0 8rpx; height: auto; overflow: hidden; } .cate-item .list-filter{ height: 80rpx; width: 100%; background: #fff; margin-bottom: 8rpx; } .cate-item .b .item{ float: left; background: #fff; width: 49%; margin-bottom: 8rpx; height: auto; overflow: hidden; text-align: center; position: relative; } .cate-item .b .item-b{ margin-left: 8rpx; } .cate-item .item .img{ width: 302rpx; height: 302rpx; } .cate-item .item .name{ display: block; margin: 11.5rpx 0 11.5rpx 0; text-align: center; overflow: hidden; padding: 0 20rpx; font-size: 30rpx; line-height: 1.2em; height: 72rpx; color: #333; } .cate-item .item .price{ display: block; text-align: center; font-size: 30rpx; color: #0075DC; } .search-result-empty{ width: 100%; height: 100%; padding-top: 300rpx; } .search-result-empty .icon{ margin: 0 auto; display: block; width: 240rpx; height: 240rpx; } .search-result-empty .text{ display: block; width: 100%; height: 40rpx; font-size: 28rpx; text-align: center; color: #999; }