|
- .BoxBg{
- background-color: #000033;
- overflow: hidden;
- font-size: 28rpx;
- min-height: 100vh;
- }
- .Box{
- width: 96%;
- margin: 0 2%;
- }
- .topBox{
- height: 70rpx;
- line-height: 20rpx;
- color: #666666;
- margin-top: 10rpx;
- }
- .TopNavigationBox{
- width: 90%;
- height: 100%;
- overflow: hidden;
- overflow-y: hidden;
- overflow-x: auto;
- white-space: nowrap;
- float: left;
- }
- .TopNavigationBox::-webkit-scrollbar {
- display: none;
- }
- .logo{
- width: 33rpx;
- float: right;
- height: 36rpx;
- float: left;
- margin-top: 10rpx;
- margin-left: 12rpx;
- }
- .item{
- /* width: 80rpx; */
- height: 60rpx;
- height: 60rpx;
- margin: 0 20rpx;
- position: relative;
- display: inline-block;
- text-align: center;
- }
- .title_a{
- font-size: 34rpx;
- color: #00cc99;
- padding-bottom: 10rpx;
- }
- .title{
- line-height: 60rpx;
- color: #666666;
- }
- .wire{
- width: 70%;
- margin: 10rpx auto;
- height: 2rpx;
- background-color: #00cc99;
- }
-
- .searchBox{
- overflow: hidden;
-
- }
- .searchF{
- width: 96%;
- height: 68rpx;
- background-color: rgba(51, 51, 51, 0.5);
- border-radius: 60rpx;
- margin: 20rpx auto;
- }
- .searchLogo{
- width: 30rpx;
- height: 30rpx;
- float: left;
- margin: 20rpx 10rpx 15rpx 60rpx;
- }
- .searchText{
- color: #666666;
- line-height: 68rpx;
- float: left;
- width: 80%;
- margin: 0 auto;
- height: 100%;
- color: #ffffff;
- }
-
- .swiperBox{
- margin: 20rpx 0;
- border-radius: 10rpx;
-
- }
- .swiper{
- width: 100%;
- height: 280rpx;
- }
- .swiperImg{
- width: 100%;
- height: 100%;
- background-color: chocolate;
- border-radius: 10rpx;
- }
- .columnBox{
- display: flex;
- justify-content: center;
- margin-top: 20rpx;
- }
- .columnItem{
- width: 20%;
- margin: 0 auto;
- }
- .columnImg{
- width: 90rpx;
- height: 90rpx;
- display: block;
- margin: 20rpx auto;
- }
- .columnText{
- color: #ffffff;
- text-align: center;
- line-height: 40rpx;
- font-size: 26rpx;
- font-family: PingFang SC;
- font-weight: 500;
- color: #FFFFFF;
- }
- .deyBox{
- overflow: hidden;
- }
- .deyTitleBox{
- /* overflow: hidden; */margin: 60rpx 0 35rpx 0;
- }
- .deyTitleImg{
- width: 48rpx;
- height: 50rpx;
- float: left;
- margin: 0 10rpx ;
- display: block;
- }
- .authorImg{
- width: 40rpx;
- height:46rpx;
- float: left;
- margin: 0 10rpx ;
- display: block;
- }
- .deyTitle{
- font-size: 36rpx;
- font-family: OPPOSans;
- font-weight: 500;
- color: #FFFFFF;
- margin-left: 10rpx;
- letter-spacing:4rpx;
-
- }
- .authorBox1{
- margin-top: 26rpx;
- }
-
-
- .authorImgTop{
- width: 110rpx;
- height: 110rpx;
- border-radius: 50%;
- margin: 40rpx auto;
- }
- .deyImgBox{
- display: flex;
- /* justify-content: space-around; */
- flex-wrap :wrap;
-
- }
-
- /* .authorOutsideBox{
- width: 100%;
-
- height: 400rpx;
- } */
- .authorBox{
- height: 380rpx;
- overflow: hidden;
- display: -webkit-box;
- overflow-x: scroll;
- -webkit-overflow-scrolling: touch;
-
- }
- .authorBox::-webkit-scrollbar {
- display: none;
- }
- .authorItem{
- width: 200rpx;
- height: 300rpx;
- margin: 0 2%;
- border-radius: 10rpx 10rpx 10rpx 40rpx;
- text-align: center;
- background-image: -webkit-linear-gradient(top, #103930, #121620);
-
- }
- .imgBox{
- width: 44%;
- overflow: hidden;
- display: inline-block;
- text-align: center;
- margin: 0 3%;
- /* height: 400rpx; */
-
- }
- .imgitem{
- position: relative;
- }
- .imgitem .img{
- width: 100%;
- /* background-color: chartreuse; */
- height: 185rpx;
- border-radius: 10rpx;
- }
- .posClass{
- position: absolute;
- right: 0;
- top: 0;
- width: 70rpx;
- height: 40rpx;
- /* background-image: url('https://zhibotang.oss-cn-beijing.aliyuncs.com/douyin/drawable-xhdpi/home_bnt_bq.png'); */
- /* background-size:74rpx 40rpx; */
- color: #ffffff;
- font-size: 24rpx;
- z-index: 100000;
- background-color: rgb(124, 122, 122,0.5);
- border-radius: 10rpx ;
- }
- .imgBox .itemTitle{
- height: 60rpx;
- line-height: 60rpx;
- text-align: center;
- color: #ffffff;
- font-size: 30rpx;
- font-family: PingFang SC;
- font-weight: 500;
- color: #FCFFFF;
-
- }
- .handpickBox{
- overflow: hidden;
- }
-
- .handpickTop{
- overflow: hidden;
- margin: 40rpx 0 20rpx 0 ;
- }
- .handpickImg{
- width: 40rpx;
- height: 46rpx;
- float: left;
- margin: 16rpx 10rpx 10rpx 10rpx ;
- }
- .handpickText{
- font-size: 36rpx;
- color:#ffffff;
- padding: 10rpx 0 30rpx 0 ;
- margin-left: 10rpx;
- float: left;
- letter-spacing:4rpx;
- font-family: OPPOSans;
- font-weight: 500;
- }
- .handpickadd{
- float: right;
- color: #00cc99;
- font-size: 30rrpx;
- margin: 10rpx 20rpx;
- }
- .handpickLogo{
- width: 50rpx;
- height: 50rpx;
- float: right;
- background-color: #00cc99;
- margin-top: 10rpx;
- margin-right: 20rpx;
- border-radius: 50%;
- color: #ffffff;
- text-align: center;
- line-height: 50rpx;
- font-size: 36rpx;
- }
- .commodityBox{
- overflow: hidden;
- margin-bottom: 30rpx;
- }
- .extendBox{
- overflow: hidden;
- margin: 40rpx 0;
- }
- .extendMoreBox{
- float: left;
- width: 45%;
- height: 70rpx;
- margin-right: 5%;
- background-color: #1A1D26;
- border-radius: 30rpx;
- }
- .changeBox {
- margin-left: 5%;
- float: left;
- background-color: #1A1D26;
- border-radius: 30rpx;
- width: 45%;
- height: 70rpx;
- }
- .commodityImg{
- width: 254rpx;
- border-radius: 10rpx;
- height: 194rpx;
- float: left;
- margin-left: 10rpx;
- }
- .newCommodityImg{
- width: 254rpx;
- border-radius: 10rpx;
- height: 194rpx;
- float: left;
- margin-left: 10rpx;
- }
- .commodityImage{
- width: 100%;
- height: 154rpx;
- border-radius: 10rpx;
- }
- .classBoxImg{
- width: 100%;
- height: 154rpx;
- border-radius: 10rpx 10rpx 0 0;
- margin: 0;
- }
- .describeBox{
- width: 384rpx;
- margin-left: 30rpx;
- float: left;
- }
- .describeBame{
- width: 100%;
- height: 64rpx;
- line-height: 32rpx;
- font-size: 30rpx;
- color: #ffffff;
- font-weight: 500;
- overflow:hidden;
- text-overflow:ellipsis;
- display:-webkit-box;
- -webkit-box-orient:vertical;
- -webkit-line-clamp:2;
- }
- .headImgBox{
- float: left;
- }
- .headImg{
- position: absolute;
-
- width: 50rpx;
- height: 50rpx;
- border-radius: 50%;
- top: 0;
- left: 0;
- }
- .annotation{
- padding-left:70rpx ;
- padding-right:50rpx ;
- float: left;
- border-radius: 50rpx;
- height: 50rpx;
- background-color: #333;
- text-align: center;
- line-height: 50rpx;
- color: #9999cc;
- overflow:hidden;
- text-overflow:ellipsis;
- display:-webkit-box;
- -webkit-box-orient:vertical;
- -webkit-line-clamp:1
- }
- .introduce{
- width: 96%;
- margin-top: 20rpx;
- color: #9999cc;
- height: 86rpx;
- line-height: 40rpx;
- overflow:hidden;
- text-overflow:ellipsis;
- display:-webkit-box;
- -webkit-box-orient:vertical;
- -webkit-line-clamp:2;
- }
- .priceBox{
- margin-top: 18rpx;
- overflow: hidden;
- }
- .priceF{
- float: left;
- color: #ff3366;
- font-size: 28rpx;
- }
- .price{
-
- color: #ff3366;
- float: left;
- /* line-height: 60rpx; */
- font-size: 28rpx;
- }
- .popularity{
- width: 180rpx;
- height: 60rpx;
- float: right;
- margin-right: 60rpx;
- margin-top: 10rpx;
- background-color: chocolate;
- }
-
- .exchangeText{
- float: left;
- color: #8790A8;
- line-height: 70rpx;
- margin-left: 20rpx;
- font-size: 30rpx;
- }
- .exchangeBox{
- width: 90%;
- margin: 20rpx auto;
- height: 70rpx;
- line-height: 70rpx;
- border-radius: 50rpx;
- text-align: center;
- background: #1A1D26;
- }
- .exchangeImg{
- width: 40rpx;
- height: 40rpx;
- margin-top: 15rpx ;
- margin-left: 260rpx;
- float: left;
- }
- .exchangeBtn{
- float: left;
- width: 50rpx;
- height: 50rpx;
- margin: 5rpx 0 0 20rpx;
- background-color: cornflowerblue;
- }
- .authorImgBox{
- background-color: rgba(51, 51, 51, 0.5);
- height: 360rpx;
- border-radius: 40rpx;
- overflow: hidden;
- }
-
- .nameBox{
- height: 120rpx;
- background-color: rgba(51, 51, 51,0.6);
- border-radius: 0rpx 40rpx 0rpx 40rpx;
- }
- .authorName{
- height: 50rpx;
- line-height: 50rpx;
- text-align: center;
- font-size: 30rpx;
- font-family: OPPOSans;
- font-weight: 500;
- color: #FFFFFF;
- overflow:hidden;
- text-overflow:ellipsis;
- display:-webkit-box;
- -webkit-box-orient:vertical;
- -webkit-line-clamp:1;
- }
- .authorText{
- width: 90%;
- margin: 0 auto;
- color: #9999cc;
- height: 50rpx;
- line-height: 50rpx;
- text-align: center;
- overflow:hidden;
- text-overflow:ellipsis;
- display:-webkit-box;
- -webkit-box-orient:vertical;
- -webkit-line-clamp:1;
- }
- .rankingBox{
- margin: 20rpx 0;
- }
- .sortBox{
- overflow: hidden;
- display: flex;
- flex-wrap: wrap;
- justify-content:flex-start;
- }
- .sortNmu{
- width: 18%;
- background-color: aqua;
- height: 360rpx;
- float: left;
-
- }
- .articleBox{
- width: 82%;
- height: 360rpx;
- float: left;
- }
- .articleImg{
- width: 40%;
- height: 100%;
- background-color: blueviolet;
- border-radius: 10rpx;
- float: left;
- }
- .articleTextBox{
- float: left;
- width: 58%;
- margin-left: 2%;
- height: 100%;
- border-radius: 10rpx;
- }
- .articleTitle{
- font-size: 34rpx;
- color: #ffffff;
- font-weight: 560;
- }
- .articlePopularity{
- width: 180rpx;
- height: 60rpx;
- float: right;
- margin-right: 20rpx;
- margin-top: 10rpx;
- background-color: chocolate;
- }
- .sortItemBox{
- width: 220rpx;
- margin: 10rpx ;
- float: left;
- }
-
- .sortItemImg{
- position: relative;
- width: 100%;
- height: 134rpx;
- border-radius: 10rpx;
- }
- .sortItemImg image{
- width: 100%;
- height: 100%;
- border-radius: 10rpx;
- }
- .sortNumBj_0{
- position: absolute;
- width: 42rpx;
- height: 55rpx;
- background-image: url('https://zhibotang.oss-cn-beijing.aliyuncs.com/douyin/drawable-xhdpi/home_rmph_ic_1.png');
- background-size:42rpx 55rpx;
- background-repeat:no-repeat;
- color: #ffffff;
- text-align: center;
- line-height: 46rpx;
- top: 0;
- left: 0;
- }
- .sortNumBj_1{
- position: absolute;
- width: 42rpx;
- height: 55rpx;
- background-image: url('https://zhibotang.oss-cn-beijing.aliyuncs.com/douyin/drawable-xhdpi/home_rmph_ic_2.png');
- background-size:42rpx 55rpx;
- background-repeat:no-repeat;
- color: #ffffff;
- text-align: center;
- line-height: 46rpx;
- top: 0;
- left: 0;
- }
- .sortNumBj_2{
- position: absolute;
- width: 42rpx;
- height: 55rpx;
- background-image: url('https://zhibotang.oss-cn-beijing.aliyuncs.com/douyin/drawable-xhdpi/home_rmph_ic_3.png');
- background-size:42rpx 55rpx;
- background-repeat:no-repeat;
- color: #ffffff;
- text-align: center;
- line-height: 46rpx;
- top: 0;
- left: 0;
- }
- .sortNumBj_3{
- position: absolute;
- width: 42rpx;
- height: 55rpx;
- background-image: url('https://zhibotang.oss-cn-beijing.aliyuncs.com/douyin/drawable-xhdpi/home_rmph_ic_4.png');
- background-size:42rpx 55rpx;
- background-repeat:no-repeat;
- color: #ffffff;
- text-align: center;
- line-height: 46rpx;
- top: 0;
- left: 0;
- }
- .sortTitle{
- height: 60rpx;
- line-height: 30rpx;
- font-size: 24rpx;
- color: #FEFEFE;
- overflow:hidden;
- text-overflow:ellipsis;
- display:-webkit-box;
- -webkit-box-orient:vertical;
- -webkit-line-clamp:2;
- margin-top: 10rpx;
- }
- .popularityBox {
- padding-bottom: 10rpx;
- }
- .popularityImg{
- float: left;
- width: 23rpx;
- height: 26rpx;
- margin-top: 8rpx;
- margin-left: 5rpx;
- }
- .popularityText{
- float: left;
- font-size: 22rpx;
- margin: 0 10rpx;
- font-family: OPPOSans;
- line-height: 40rpx;
- font-weight: 500;
- }
- .popularityNum{
- float: left;
- color: #07E881;
- font-size: 24rpx;
- height: 40rpx;
- line-height: 40rpx;
- }
-
- .newPopularity{
- width: 100%;
- /* position: absolute; */
- /* bottom: 0; */
- /* left: 10; */
- background-color: #222735;
- height: 40rpx;
- border-radius: 0 0 10rpx 10rpx ;
- margin-top: -8rpx;
- }
|