如何在Quarto-Reveal.js演示文稿中左对齐标题与作者？

问题根源 #

你之前用position: relative加left: -15%的方式之所以不对齐，核心原因是：

• Reveal.js默认的标题块（.quarto-title-block）自带max-width和margin: 0 auto的居中样式，导致标题和作者的容器本身就处于居中状态，而非左对齐起始。
• position: relative的百分比偏移是基于父容器宽度，但标题和作者的包裹容器布局不同，相同百分比偏移的实际像素距离不一致。

修正后的SCSS代码 #

先删掉你原SCSS末尾多余的闭合}，再替换成以下代码：

/*-- scss:defaults --*/

/*-- scss:rules --*/
#title-slide {
  text-align: left;
  /* 控制所有内容离左边界的距离，可按需调整百分比或像素值 */
  padding-left: 10%;
  /* 可选：调整内容垂直位置，比如让整体往下移 */
  padding-top: 20%;
}

/* 重置默认的居中标题块样式 */
#title-slide .quarto-title-block {
  max-width: unset;
  margin: 0;
  text-align: left;
}

#title-slide .title {
  font-size: 2.5em;
  color: #fff;
  /* 去掉原来的relative定位和偏移 */
  position: static;
  /* 可选：调整标题与作者的垂直间距 */
  margin-bottom: 1.5em;
}

#title-slide .quarto-title-author-name {
  color: #ffffff;
  /* 去掉原来的relative定位 */
  position: static;
}

关键调整点 #

1. 统一左对齐基准：通过#title-slide的padding-left设置整体内容离左边界的距离，标题和作者会自动对齐到这个基准线，避免各自偏移的误差。
2. 重置居中容器：去掉.quarto-title-block的默认居中样式，确保内部元素完全遵循父容器的左对齐设置。
3. 放弃相对偏移：用position: static（默认值）代替relative，改用margin/padding调整间距，布局更稳定可控。

内容的提问来源于stack exchange，提问作者Florence.