/**index.wxss**/ page{ background: #F4F7F9; } .top{ padding: 0 12px; display: flex; flex-wrap: wrap; justify-content: space-between; } .logo{ /* height:200rpx; */ background:linear-gradient(90deg,rgba(75,153,255,1) 0%,rgba(91,61,255,1) 100%); border-radius:6px; position: relative; padding: 58rpx 58rpx 0rpx 170rpx; width: 100%; height: 220rpx; } .logo view{ font-family: cursive; font-weight: bold; font-size: 46rpx; color: #fff; } .logo text{ color: #fff; font-size: 24rpx; } .logo image{ width: 120rpx; max-height: 120rpx; position: absolute; left: 15px; top: 0; bottom: 0; margin: auto; } .part{ width: 100%; background: #fff; margin-top: 8px; box-shadow:0px 4px 12px 0px rgba(0,0,0,0.08); border-radius:4px; position: relative; text-align: left; padding: 15px; } .part image{ /* width: 100rpx; */ width:64rpx; max-height: 100%; position: absolute; right: 15px; top:0; bottom: 0; margin: auto; } .part view{ color: #333333; font-size: 34rpx; font-family: 'Microsoft YaHei'; font-weight: 500; } .part text{ color: #999999; font-size: 24rpx; } .news{ width: 100%; padding: 10px 12px; background: #fff; margin-top: 12px; box-shadow:0px 4px 12px 0px rgba(0,0,0,0.08); border-radius:4px; white-space: nowrap; overflow: hidden; } .news text{ padding-left: 20px; } .marquee_container image{ width: 53px; max-height: 30px; position: absolute; left: 10px; top: 15px; } .bottom{ background: #fff; margin-top: 12px; } .tab{ border-bottom: 1px solid #F2F3F4; display: flex; } .tab text{ display:block; width: 33.33%; line-height: 44px; text-align: center; color: #999999; font-size: 14px; } .tab .active{ color: #3566FF; border-bottom: 2px solid #3566FF; transition: all .3s linear; } .list{ border-bottom: 1px solid #F2F3F4; padding: 15px; } .list text{ color: #999; font-size: 24rpx; } /*首页跑马灯效果*/ @keyframes around { from { margin-left: 90%; } to { /* var接受传入的变量 */ margin-left: var(--marqueeWidth--); } } .zd{ width: 80px; height: 100%; position: absolute; left: 0; top: 0; background: #fff; } .marquee_container{ width: 100%; background: #fff; margin-top: 12px; box-shadow:0px 4px 12px 0px rgba(0,0,0,0.08); border-radius:4px; padding: 10px 12px; position: relative; overflow: hidden; } .marquee_container:hover{ /* 不起作用 */ animation-play-state: paused; } .marquee_text{ color:#333; font-size: 28rpx; display: inline-block; white-space: nowrap; animation-name: around; animation-duration: 10s; /*过渡时间*/ animation-iteration-count: infinite; animation-timing-function:linear; } .marquee_text navigator{ margin-right: 200px; } .friendlyLink{ padding:15px; /* margin:15px; */ }