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

【问题标题】：How can I show angle braces < text > when using CSS in xaringan在 xaringan 中使用 CSS 时如何显示尖括号 < text >
【发布时间】：2021-04-11 15:17:34
【问题描述】：

我想使用 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 后跟尖括号中的单词 command？

【问题讨论】：

标签： css r-markdown xaringan

【解决方案1】：

编辑

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

.red {
  color: red;  
}

.red:before {
    content: '\003C';
}

.red:after {
    content: '\003E';
}

然后，只需致电.red[command]。特殊字符< 和> 将分别添加到red:before 和red:after 之前。

【讨论】：

这是一些高质量的魔法。谢谢！您知道为什么 xaringan 不显示尖括号中的文本吗？
不客气。我猜它与 HTML 元素有关，它们被称为内尖括号 <>。

【解决方案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 没有在尖括号内显示任何内容。