|
- .BoxBg{
- background-color: #000033;
- overflow: hidden;
- font-size: 28rpx;
- min-height: 100vh;
- }
- .Box{
- width: 96%;
- margin: 0 2%;
- }
- .topBox{
- height: 70rpx;
- 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: 32rpx;
- float: right;
- height: 36rpx;
- float: left;
- margin-top: 10rpx;
- margin-left: 12rpx;
- }
- .item{
- width: 80rpx;
- margin: 0 20rpx;
- position: relative;
- display: inline-block;
- text-align: center;
- }
- .title_a{
- font-size: 34rpx;
- color: #00cc99;
- }
- .title{
- color: #666666;
- }
- .wire{
- width: 70%;
- margin: 10rpx auto;
- height: 2rpx;
- background-color: #00cc99;
- }
-
- .searchBox{
- overflow: hidden;
-
- }
- .searchText{
- color: #666666;
- line-height: 80rpx;
- }
- .searchF{
- width: 90%;
- height: 80rpx;
- background-color: rgba(51, 51, 51, 0.5);
- border-radius: 60rpx;
- margin: 20rpx auto;
- }
- .searchLogo{
- width: 40rpx;
- height: 40rpx;
- float: left;
- margin: 20rpx 10rpx 15rpx 60rpx;
- }
- .searchText{
- float: left;
- width: 80%;
- margin: 0 auto;
- height: 100%;
- color: #ffffff;
- }
-
- .swiperBox{
- margin: 30rpx 0;
- border-radius: 10rpx;
-
- }
- .swiper{
- height: 320rpx;
- }
- .swiperImg{
- width: 100%;
- height: 100%;
- background-color: chocolate;
- border-radius: 10rpx;
- }
- .columnBox{
- height: 180rpx;
- padding: 40rpx 0 ;
- display: flex;
- justify-content: center;
- }
- .columnItem{
- width: 20%;
- margin: 0 auto;
-
-
- }
- .columnText{
- color: #ffffff;
- text-align: center;
- line-height: 40rpx;
- }
- .deyBox{
- overflow: hidden;
-
- }
- .deyTitleBox{
- /* overflow: hidden; */margin: 20rpx 0;
- }
- .deyTitleImg{
- width: 60rpx;
- height: 70rpx;
- float: left;
- margin: 0 10rpx;
- }
- .deyTitle{
- font-size: 36rpx;
- color:#ffffff;
- font-weight: 700;
- padding: 10rpx 0 30rpx 0 ;
- margin-left: 10rpx;
- letter-spacing:4rpx;
-
- }
- .authorBox1{
- margin-top: 20rpx;
- }
-
-
- .authorImgTop{
- width: 150rpx;
- height: 150rpx;
- background-color: #00cc99;
- 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: 32%;
- /* height: 400rpx; */
- margin: 0 2%;
- border-radius: 10rpx 10rpx 10rpx 40rpx;
- text-align: center;
- background-image: -webkit-linear-gradient(top, #103930, #121620);
-
- }
- .imgBox{
- width: 46%;
- overflow: hidden;
- display: inline-block;
- text-align: center;
- margin: 0 2%;
- /* height: 400rpx; */
-
- }
- .imgitem{
- position: relative;
- }
- .imgitem .img{
- width: 100%;
- /* background-color: chartreuse; */
- height: 200rpx;
- border-radius: 10rpx;
- }
- .posClass{
- position: absolute;
- right: 0;
- top: 0;
- width: 70rpx;
- height: 40rpx;
- background-image: url('https://formall.oss-accelerate.aliyuncs.com/douyin/drawable-xhdpi/home_bnt_bq.png');
- background-size:70rpx 40rpx;
- color: #ffffff;
- font-size: 24rpx;
- z-index: 100000;
- }
- .imgBox .itemTitle{
- height: 60rpx;
- line-height: 60rpx;
- text-align: center;
- color: #ffffff;
- font-size: 30rpx;
-
- }
- .handpickBox{
- overflow: hidden;
- }
-
- .handpickTop{
- overflow: hidden;
- margin: 40rpx 0 ;
- }
- .handpickImg{
- width: 60rpx;
- height: 70rpx;
- float: left;
- margin: 0 10rpx;
- }
- .handpickText{
- font-size: 36rpx;
- color:#ffffff;
- font-weight: 700;
- height: 36rpx;
- padding: 10rpx 0 30rpx 0 ;
- margin-left: 10rpx;
- float: left;
- letter-spacing:4rpx
- }
- .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{
- position: relative;
- width: 320rpx;
- background-color: chocolate;
- border-radius: 10rpx;
- height: 200rpx;
- float: left;
- margin-left: 10rpx;
- }
- .commodityImage{
- width: 100%;
- height: 100%;
- border-radius: 10rpx;
- }
- .classBoxImg{
- width: 100%;
- height: 100%;
- border-radius: 10rpx;
- }
- .describeBox{
- width: 360rpx;
- margin-left: 30rpx;
- float: left;
- }
- .describeBame{
- width: 80%;
- height: 50rpx;
- line-height: 50rpx;
- font-size: 34rpx;
- color: #ffffff;
- font-weight: 560;
- overflow:hidden;
- text-overflow:ellipsis;
- display:-webkit-box;
- -webkit-box-orient:vertical;
- -webkit-line-clamp:1;
- }
- .headImgBox{
- float: left;
- }
- .headImg{
- float: left;
- width: 60rpx;
- height: 60rpx;
- border-radius: 50%;
- background-color: #00cc99;
- }
- .annotation{
- width: 240rpx;
- border-radius: 50rpx;
- height: 60rpx;
- background-color: #333;
- text-align: center;
- line-height: 60rpx;
- color: #9999cc;
- }
- .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: 20rpx;
- overflow: hidden;
- }
- .priceF{
- float: left;
- color: #ff3366;
- line-height: 60rpx;
- }
- .price{
- font-size: 34rpx;
- color: #ff3366;
- float: left;
- line-height: 60rpx;
- }
- .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: 140rpx;
- background-color: rgba(51, 51, 51,0.6);
- border-radius: 0rpx 40rpx 0rpx 40rpx;
- }
- .authorName{
- height: 60rpx;
- line-height: 60rpx;
- text-align: center;
- color: #ffffff;
- font-size: 36rpx;
- font-weight: 600;
- }
- .authorText{
- width: 90%;
- margin: 0 auto;
- color: #9999cc;
- height: 60rpx;
- line-height: 60rpx;
- 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;
-
- }
- .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: 31%;
- margin: 20rpx 1%;
- float: left;
- }
-
- .sortItemImg{
- position: relative;
- width: 100%;
- height: 160rpx;
- border-radius: 10rpx;
- }
- .sortItemImg image{
- width: 100%;
- height: 100%;
- border-radius: 10rpx;
- }
- .sortNumBj_0{
- position: absolute;
- width: 52rpx;
- height: 65rpx;
- background-image: url('https://formall.oss-accelerate.aliyuncs.com/douyin/drawable-xhdpi/home_rmph_ic_1.png');
- background-size:52rpx 65rpx;
- color: #ffffff;
- text-align: center;
- line-height: 46rpx;
- top: 0;
- left: 0;
- }
- .sortNumBj_1{
- position: absolute;
- width: 52rpx;
- height: 65rpx;
- background-image: url('https://formall.oss-accelerate.aliyuncs.com/douyin/drawable-xhdpi/home_rmph_ic_2.png');
- background-size:52rpx 65rpx;
- color: #ffffff;
- text-align: center;
- line-height: 46rpx;
- top: 0;
- left: 0;
- }
- .sortNumBj_2{
- position: absolute;
- width: 52rpx;
- height: 65rpx;
- background-image: url('https://formall.oss-accelerate.aliyuncs.com/douyin/drawable-xhdpi/home_rmph_ic_3.png');
- background-size:52rpx 65rpx;
- color: #ffffff;
- text-align: center;
- line-height: 46rpx;
- top: 0;
- left: 0;
- }
- .sortNumBj_3{
- position: absolute;
- width: 52rpx;
- height: 65rpx;
- background-image: url('https://formall.oss-accelerate.aliyuncs.com/douyin/drawable-xhdpi/home_rmph_ic_4.png');
- background-size:52rpx 65rpx;
- color: #ffffff;
- text-align: center;
- line-height: 46rpx;
- top: 0;
- left: 0;
- }
- .sortTitle{
- height: 40rpx;
- line-height: 40rpx;
- font-size: 32rpx;
- color: #FEFEFE;
- overflow:hidden;
- text-overflow:ellipsis;
- display:-webkit-box;
- -webkit-box-orient:vertical;
- -webkit-line-clamp:1;
- margin: 10rpx 0;
- }
- .popularityBox {
- padding: 10rpx 0;
- }
- .popularityImg{
- float: left;
- width: 23rpx;
- height: 26rpx;
- margin-top: 8rpx;
- margin-left: 5rpx;
- }
- .popularityText{
- float: left;
- font-size: 26rpx;
- margin: 0 10rpx;
- }
- .popularityNum{
- float: left;
- color: #07E881;
- font-size: 26rpx;
- }
-
- .newPopularity{
- width: 100%;
- position: absolute;
- bottom: 0;
- left: 10;
- background-color: #222735;
- height: 40rpx;
- border-radius: 0 0 10rpx 10rpx ;
- }
|