/**index.wxss**/ /*首页跑马灯效果*/ @keyframes around { from { margin-left: 90%; } to { /* var接受传入的变量 */ margin-left: -100%; } } .zd{ width: 80px; height: 100%; position: absolute; left: 0; top: 0; background: #fff; } .marquee_container{ width: 100%; background: #fff; /* box-shadow:0px 4px 12px 0px rgba(0,0,0,0.08); */ border-radius:4px; padding: 12.5px 12px; position: relative; overflow: hidden; height: 90rpx; } .marquee_container:hover{ /* 不起作用 */ animation-play-state: paused; } .marquee_text{ color:#333; font-size: 28rpx; display: flex; white-space: nowrap; animation-name: around; animation-duration: 15s; /*过渡时间*/ animation-iteration-count: infinite; animation-timing-function:linear; } .marquee_text navigator{ margin-right: 20px; } .marquee_container image{ width: 60px; max-height: 30px; position: absolute; left: 10px; top: 30rpx; } page{ background: #F7F7F7; } .tab{ background: #fff; margin-top: 16rpx; padding:0 25rpx; display: flex; justify-content: space-between; } .tab view{ font-size: 28rpx; color: #333; line-height: 90rpx; transition: all .1s linear; } .tab .act{ font-size: 38rpx; font-weight: 500; line-height: 88rpx; } swiper{ background: #fff; height: calc(100vh - 92rpx - 100rpx); } scroll-view{ height: 100%; padding: 20rpx 25rpx 0; } .item1{ border-bottom: 1px solid #F5F5F5; margin-bottom: 30rpx; } .name{ font-size: 32rpx; font-weight: 500; margin-bottom: 20rpx; } .name>text{ color: #AAAAAA; font-size: 20rpx; border: 1px solid #AAAAAA; border-radius: 4rpx; font-weight: 400; padding: 0 4rpx; position: relative; top: -3rpx; } .name view{ float: right; color: #CE994F; font-size: 22rpx; text-align: center; position: relative; top: -5rpx; } .name view text{ display: block; font-size: 32rpx; color: #CE994F; position: relative; top: -8rpx; } .info{ font-size: 30rpx; padding: 10rpx 0; display: flex; flex-wrap: wrap; } .info view{ color: #666; width: 85%; vertical-align: top; } .info label{ font-weight: 500; color: #333; } .imgs{ margin: 30rpx 0; } .img{ display: inline-block; width: 224rpx; height: 224rpx; border-radius: 8rpx; margin-right: 8rpx; margin-bottom: 8rpx; } /* //热门股票 */ .item2{ padding: 20rpx 25rpx 0; } .date-picker{ text-align: center; font-weight: 500; font-size: 32rpx; } .hot{ border-radius: 16rpx; margin-top: 30rpx; box-shadow: 0px 0px 12px 0px rgba(218, 217, 217, 0.5); } .tab1{ color: #D94B24; padding: 0 24rpx; font-weight: 500; font-size: 40rpx; line-height: 88rpx; border-radius: 16rpx 16rpx 0px 0px; background: linear-gradient(124deg, #FEEAEC 0%, #FFAEAF 100%); } .tab2{ color: #2383E5; padding: 0 24rpx; font-weight: 500; font-size: 40rpx; line-height: 88rpx; border-radius: 16rpx 16rpx 0px 0px; background: linear-gradient(124deg, #ECF6FF 0%, #B4D9FF 100%); } .hot image{ width: 54rpx; position: relative; top:3rpx; } .gp{ display: flex; justify-content: space-between; padding: 24rpx; } .gp-name{ font-weight: 500; font-size: 32rpx; width: 70%; padding-left: 8rpx; } .num{ font-size: 28rpx; color: #666; text-align: right; width: 200rpx; } .num text{ font-size: 36rpx; font-weight: 500; } .more{ display: block; border-top: 1px solid #F5F5F5; line-height: 94rpx; text-align: center; font-size: 28rpx; color: #333; } .more image{ width: 24rpx; position: relative; top: 3rpx; } /* 胜率 */ .win{ position: relative; padding: 30rpx 0; padding-left: 59rpx; border-bottom: 1px solid #F5F5F5; } .win image{ width: 50rpx; position: absolute; top: 33rpx; left: 0; } .hot .rank{ width:50rpx;text-align:center;color:#CE994F; display: inline-block; } .win .rank{ position: absolute; top: 32rpx; left: 0; width:50rpx;text-align:center;color:#CE994F; } .win .name view{ float: right; color: #666; font-size: 28rpx; text-align: center; position: relative; top: 0; font-weight: 400; } .win .name view text{ font-size: 36rpx; color: #E90001; display: inline; top: 0; } .win .tag{ font-size: 28rpx; color: #CE994F; border: 1px solid #CE994F; border-radius: 8rpx; margin-right: 8rpx; font-weight: 400; padding: 0 8rpx; margin-bottom: 10rpx; } /* 冠军心得 */ .list{ display: flex; justify-content: space-between; border-bottom: 1px solid #F5F5F5; padding: 24rpx 0; } .list image{ width: 174rpx; height: 120rpx; border-radius: 8rpx; } .list>view{ width: 70%; font-size: 32rpx; } .list .title{ height: 88rpx; } .list text{ font-size: 28rpx; color: #999; } .exp{ color: #D94B24; font-size: 24rpx; }