自定义xaringan中所有幻灯片的字体大小

时间:2018-11-26 13:01:12

标签: css xaringan

我正在使用Yihui的超棒软件包xaringan来生成html幻灯片,对于熟悉xaringan或CSS的人来说,这可能是一个非常简单的问题:

我不知道如何设置所有幻灯片的字体大小。我试图在自定义CSS中定义font-size,类似于body{font-size: 200%}body{font-size: xx-large},然后在YAML中调用它:

output: xaringan::moon_reader: css: [custom.css]

什么都没有改变。 我知道我可以使用.large类来更改某些单词的大小,并可以在幻灯片的开头使用class: large来更改整个页面的正文字体。但是,是否有一种方法可以避免将class:large粘贴到我制作的每张幻灯片上,而是一次设置所有字体大小?任何建议将不胜感激!

1 个答案:

答案 0 :(得分:4)

YAML标头:

---
title: "Presentation Ninja"
subtitle: "⚔<br/>with xaringan"
author: "Yihui Xie"
date: "2016/12/12 (updated: `r Sys.Date()`)"
output:
  xaringan::moon_reader:
    lib_dir: libs
    nature:
      highlightStyle: github
      highlightLines: true
      countIncrementalSlides: false
---

尝试将以下行添加到Rmd文件中或将其放入custom.css中:

<style type="text/css">
.remark-slide-content {
    font-size: 30px;
    padding: 1em 4em 1em 4em;
}
</style>

说明:

  • 上面的代码覆盖了remark-slide-content的默认样式,以更改幻灯片在remark-slide-content类下的字体大小,该样式适用于幻灯片中的所有文本。

  • 在测试期间,也应相应调整填充。自己尝试一下。

  • 已修改:如果幻灯片不是独立的(即CSS文件是单独保存的),则不需要!important规则。

  • 再次编辑(请参见下面的评论):

要设置一页的字体大小,首先,在CSS部分中定义一个类:

.my-one-page-font {
  font-size: 40px;
}

然后在幻灯片标题之前添加class: my-one-page-font