一段css解决obsidian幻灯片因文本内容多不能上下滚动显示不全的问题

/*
 * === Obsidian Slides Vertical Screen FIX v5.0 (Definitive) ===
 * 1. [已修复] 修复竖屏下幻灯片强制居中问题。
 * 2. [已修复] 修复内容从中间开始,顶部不可见的问题。
 * 3. [新] 强制清除JS施加的 transform 偏移,确保内容从顶部开始。
 */

/* ================================================================== */
/* SECTION 1: 核心修复 - 只在竖屏模式下生效                     */
/* ================================================================== */
@media (orientation: portrait) {
    
    /* 目标:被JS脚本动态居中的 .slides “舞台”容器 */
    body:has(.reveal) .reveal .slides {
        
        /* [关键修复] 强制清除 JS 添加的 transform 偏移!*/
        transform: none !important;
        
        /* 用 top 定位,取代 transform 来进行垂直定位 */
        top: 2vh !important; /* 距离屏幕顶部留出一点(2%)空隙 */

        /* 重置其他可能影响定位的属性 */
        margin: 0 auto !important; /* 垂直margin清零,水平居中 */
        left: 0 !important;
        right: 0 !important;
    }
}

/* ================================================================== */
/* SECTION 2: 滚动区布局 (使用最稳妥的设定)                     */
/* ================================================================== */

body:has(.reveal) .reveal .slides section {
    /* 使用绝对值高度,确保布局稳定 */
    height: 95vh !important; /* 你可以微调,比如 94vh, 96vh */

    /* 允许垂直滚动 */
    overflow-y: auto !important;
    overflow-x: hidden !important;

    /* 内边距 */
    padding: 30px 50px !important;
    box-sizing: border-box !important; /* 确保内边距不会撑大容器 */
}

/* ================================================================== */
/* SECTION 3: 样式和美化 (保持不变)                               */
/* ================================================================== */

/* 字体大小 */
body:has(.reveal) .reveal .slides section {
    font-size: 0.8em;
}
body:has(.reveal) .reveal .slides section h1 {
    font-size: 1.8em;
    margin-bottom: 0.5em;
}
body:has(.reveal) .reveal .slides section h2 {
    font-size: 1.4em;
    margin-bottom: 0.4em;
}

/* 美化滚动条 */
body:has(.reveal) .reveal .slides section::-webkit-scrollbar {
    width: 8px;
}
body:has(.reveal) .reveal .slides section::-webkit-scrollbar-track {
    background: transparent;
}
body:has(.reveal) .reveal .slides section::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.3);
    border-radius: 4px;
}
body:has(.reveal) .reveal .slides section::-webkit-scrollbar-thumb:hover {
    background: rgba(255, 255, 255, 0.5);
}

点设置-外观-自定义css-文件夹图标 然后把这个css放进去开启即可

现在幻灯片展示时右侧有了滚动条而且横屏竖屏都适配,从顶部到底留白极小,文字显示内容多。