在 xaringan 中使用 CSS 时如何显示尖括号 < text >

Question

我想使用 CSS 为 xaringan 幻灯片中的不同单词着色。

我创建了一个名为 stuff.css 的文件，其中包含：

.red {
color: red;  
}

我的 rmarkdown 文件有这个：

---
title: "test"
output:
  xaringan::moon_reader:
    css: ["stuff.css"]
    lib_dir: libs
---

blah .red[<command]

blah .red[command>]

blah .red[<command>]

前两行显示如我所料（[ ] 内的文本为红色）但第三行仅显示废话。为什么会这样？如何让第三行显示 blah 后跟尖括号中的单词命令？

Answer 1

编辑

这应该可以解决问题。将这些添加到您的 css 文件中：

.red {
  color: red;  
}

.red:before {
    content: '[=10=]3C';
}

.red:after {
    content: '[=10=]3E';
}

然后，直接调用.red[command]。特殊字符<和>将分别在前面加上red:before，在后面加上red:after。

Answer 2

您可以在 Rmarkdown 中使用 CSS 多种方式来控制输出中的彩色单词。整体主体颜色为 red，而我可以使用内联 CSS 代码覆盖颜色。

---
title: "test"
output:
  xaringan::moon_reader:
    lib_dir: libs
---

```{css, echo = FALSE}
body{
  color: red;
}
```

red

<span style="color:black">black</span>

<span style="color:green">green</span>

在 xaringan 中使用 CSS 时如何显示尖括号 < text >

How can I show angle braces < text > when using CSS in xaringan

css

r-markdown

xaringan