| | |
| | | background: #FFFFFF; |
| | | box-shadow: 0rpx 9rpx 9rpx 2rpx rgba(0, 0, 0, 0.06); |
| | | padding: 20rpx 50rpx; |
| | | margin-bottom: 100rpx; |
| | | font-family: PingFang SC, PingFang SC; |
| | | font-weight: 400; |
| | | font-size: 29rpx; |
| | |
| | | .pictureBox { |
| | | display: flex; |
| | | justify-content: center; |
| | | margin-top: 160rpx; |
| | | margin-top: 20rpx; |
| | | width: 100%; |
| | | height: 100%; |
| | | } |
| | | |
| | | .pictureBox image { |
| | | /* width: 100%; |
| | | height: auto; */ |
| | | } |
| | | |
| | | .download-btn { |
| | | width: 100%; |
| | | height: 100%; |
| | | } |
| | | |
| | | .heart { |
| | | animation-name: scaleDraw; |
| | | /*关键帧名称*/ |
| | | animation-timing-function: ease-in-out; |
| | | /*动画的速度曲线*/ |
| | | animation-iteration-count: infinite; |
| | | /*动画播放的次数*/ |
| | | animation-duration: 2s; |
| | | /*动画所花费的时间*/ |
| | | } |
| | | |
| | | @keyframes scaleDraw { |
| | | |
| | | /*定义关键帧、scaleDrew是需要绑定到选择器的关键帧名称*/ |
| | | 0% { |
| | | transform: scale(1); |
| | | /*开始为原始大小*/ |
| | | } |
| | | |
| | | 25% { |
| | | transform: scale(1.5); |
| | | /*放大1.1倍*/ |
| | | } |
| | | |
| | | 50% { |
| | | transform: scale(1.75); |
| | | } |
| | | |
| | | 75% { |
| | | transform: scale(2.0); |
| | | } |
| | | } |
| | | |
| | | .img-box { |
| | | display: flex; |
| | | flex-direction: column; |
| | | justify-content: center; |
| | | align-items: center; |
| | | box-shadow: 0 3px 6px 1px #00000029; |
| | | } |
| | | |
| | | .excelBox { |
| | | margin: 30rpx auto; |
| | | } |
| | | |
| | | .textBox { |
| | | display: flex; |
| | | font-size: 24rpx; |
| | | } |
| | | |
| | | .textWidth { |
| | | text-align: center; |
| | | flex: 1; |
| | | } |