如何调整Quarto RevealJS格式下演讲笔记的默认字体大小

我尝试减小Quarto的RevealJS格式里演讲笔记的字体大小，目前的CSS文件内容如下：

.slides h1 {
    font-size : 150%;
}

.slides h2 {
    font-size: 140%;
}

.speaker-notes { 
    font-size: 4px; 
}        

/* .show-speaker-notes .speaker-notes { */
/*     font-size: 4px;  */
/* } */
/* .slides .speaker-notes {  */
/*     font-size: 4px;  */
/* }         */
/* .slides speaker-notes {  */
/*     font-size: 4px;  */
/* }         */

h1和h2的字体大小修改符合预期，但演讲笔记的字体大小始终无法调整，已经试过几种注释掉的写法都无效。我知道演讲笔记加载后可以通过Ctrl--和Ctrl-+调整相对字体大小，但默认字体大小应该是能直接调整的，另外代码里写的4px只是为了测试变化效果，不是实际需求。

解决方案 #

要覆盖RevealJS默认的演讲笔记字体样式，需要使用优先级更高的CSS选择器。正确的写法是：

.reveal .speaker-notes {
    font-size: 14px; /* 替换为你需要的实际字体大小 */
}

原因说明 #

RevealJS的演讲笔记元素嵌套在.reveal根容器内，默认样式的选择器包含这个父容器前缀，优先级高于单独的.speaker-notes或你之前尝试的其他写法。加上.reveal前缀后，选择器优先级足够覆盖默认设置，就能生效了。

如果需要调整笔记的其他样式，也可以在这个选择器中添加属性，比如：

.reveal .speaker-notes {
    font-size: 14px;
    line-height: 1.5;
    padding: 12px;
}

内容的提问来源于stack exchange，提问作者Robert McDonald