You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

求助:Quarto Reveal.js演示无法生成全宽页面

调整Quarto Reveal.js演示文稿的幻灯片宽度

你用的page-layout: full是针对常规HTML文档的布局设置,对Reveal.js幻灯片不生效,得用Reveal.js本身的宽度配置参数来调整。

方法1:直接在YAML里配置Reveal.js宽度参数

在revealjs格式配置中添加width参数(可搭配height保持比例),支持固定像素值或百分比:

format:
  revealjs:
    incremental: false
    theme: moon
    footer: "Slurm walk-through"
    logo: RSG.png
    css: logo.css
    fig-cap-location: margin
    code-line-numbers: true
    fontsize: 30px
    width: 1200  # 固定宽度,比如1200px
    # 也可以用百分比适配不同屏幕:width: "90%"
    # 可选:同步设置高度维持比例
    # height: 675
---

方法2:用CSS自定义精细控制边距

如果固定宽度不够灵活,直接在你的logo.css中添加样式,调整幻灯片容器的边距和宽度:

/* 调整幻灯片整体的左右边距 */
.reveal .slides {
  margin-left: 2%;
  margin-right: 2%;
  width: 96%;
}

/* 进一步放开内容区域的最大宽度限制 */
.reveal .slides section {
  max-width: 100%;
}

这样就能解决左右边距过宽、空间浪费的问题。

内容的提问来源于stack exchange,提问作者James

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.07.15 07:18:10