【代码片段】全荧幕阅读文档时显示底栏

.fullscreen {
   z-index:2;
}
/*再来一段进入全屏的动画，感谢light-blue代码*/
@keyframes fullscreen { 0% { opacity: 0; } 50% { transform: scale(1.01); opacity: 0.5; } }
.fullscreen {
   animation:0.4s fullscreen ease-in-out;
}
/*第一种适配方案：非透明底栏防止使用翻页键滚动文档时有内容被底栏遮挡*/
body.body--win32 .fullscreen>.protyle-breadcrumb, body.body--win32 .fullscreen>.block__icons {
   margin-top:30px;
}
.fullscreen {
   top:-30px;
}
/*第二种适配方案：将底栏设置为悬浮时显示，否则透明不遮挡文档*/
body.body--win32:has(.fullscreen) .status *{
   opacity:0;
}
body.body--win32:has(.fullscreen) .status:hover *{
   opacity:1;
   transition:var(--b3-transition);
}

​

按需复制，启用后：（可以看到底栏上的文字计数以及文本朗读插件）

灵感来源：