123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108 |
- .readingPage{
- height: 100%;
- overflow: hidden;
- }
- .videoSection {
- width: 750rpx;
- height: 421.9rpx;
- }
- audio {
- background: #000;
- width: 100%;
- height: 200rpx;
- position: fixed;
- bottom: 200rpx;
- }
- .textSection{
- width: 100%;
- height: 50%;
- padding-bottom: 200rpx;
- overflow: visible;
- }
- .textSection .textContent{
- font-size: 32rpx;
- line-height: 56rpx;
- text-align: center;
- display: block;
- margin: 0 50rpx;
- color: #444;
- }
- ::-webkit-scrollbar{
- width: 0;
- height: 0;
- color: transparent;
- }
- /**底部按钮区域**/
- .footSection {
- width: 750rpx;
- height: 192rpx;
- position: fixed;
- bottom: 0;
- display: flex;
- flex-direction: row;
- justify-content: space-between;
- align-items: center;
- }
- .blackbord {
- width: 100%;
- height: 192rpx;
- display: block;
- position: absolute;
- top: 0;
- left: 0;
- z-index: -1;
- }
- .readingBtn {
- width: 148rpx;
- height: 148rpx;
- border-radius: 50%;
- display: flex;
- align-items: center;
- margin: 60rpx auto 0;
- }
- .footerBtn {
- display: flex;
- flex-direction: column;
- margin-top: 60rpx;
- }
- .collectBtn {
- margin-left: 80rpx
- }
- .shareBtn {
- margin-right: 80rpx
- }
- .footerBtn image {
- width: 50rpx;
- height: 48rpx;
- display: block;
- margin: 0 auto 18rpx;
- }
- .footerBtn text {
- width: 112rpx;
- height: 40rpx;
- font-size: 28rpx;
- color: #414141;
- text-align: center;
- }
- .footSection .microphone {
- display:block;
- margin:-12rpx auto 8rpx;
- width:108rpx;
- height:106rpx;
- }
- .footSection .readingBtn text {
- margin-top: -10rpx;
- }
|