如何将自定义列表样式仅应用于特定列表？

Question

我正在编写一个包含 .css 样式文件的四开文档，并在目录和参考文献中获取项目符号以及换行符。项目符号列表显示正确。它与我正在使用的 .css 文件有关。

我公司的风格包括用于项目符号列表的红色斜线，这正是我想要的。我不希望它出现在目录或参考文献中。 如何使目录和参考文献中的项目符号以及换行消失？：

这是我的代码：

---
title: "Line Feed No Bueno"
execute:
  echo: false
  warning: false
format: 
  html:
    css: mystyle.css
    toc: true
---

```{r}
library(knitr)
library(rmarkdown)
```

* List item A
* List item B


# References
This document was generated using the R[^1] software environment and employs rmarkdown[^2] for formatting.

[^1]: R Core Team (2024). _R: A Language and Environment for Statistical Computing_. R Foundation for Statistical Computing, Vienna, Austria. URL <https://www.R-project.org/>.

[^2]: JJ Allaire, et al (2024). _rmarkdown: Dynamic Documents for R_. R package version 2.27. <https://github.com/rstudio/rmarkdown>.

这是我的

mystyle.css

文件...

ul {
  list-style: none; /* Remove list bullets */
  padding: 0;
  margin: 0;
  padding-bottom: 0px;
  font-size: 11pt;
  font-family: 'Aktiv Grotesk';
}

li {
  padding-left: 0px;
  padding-bottom: 0px; 
  padding-top: 0px;
  font-size: 11pt;
  font-family: 'Aktiv Grotesk';
}

li::before {
  content: "/"; /* Insert content that looks like bullets */
  padding-right: 8px;
  padding-top: 0px;
  padding-bottom: 0px;
  color: red; /* Or a color you prefer */
}

Answer 1

li::before

选择器针对文档中的太多元素。您可以使用自定义项目符号将列表包装在具有专用类的

div

中，例如

::: {.myList}
* List item A
* List item B
:::

并且在

css

中，您仅将样式应用于此类的子项：

.myList > ul > li::before {
  /* styles */
}

---

完整示例：

quarto.qmd

---
title: "Line Feed No Bueno"
execute:
  echo: false
  warning: false
format: 
  html:
    css: mystyle.css
    toc: true
---

```{r}
library(knitr)
library(rmarkdown)
```

::: {.myList}
* List item A
* List item B
:::

# References
This document was generated using the R[^1] software environment and employs rmarkdown[^2] for formatting.

[^1]: R Core Team (2024). _R: A Language and Environment for Statistical Computing_. R Foundation for Statistical Computing, Vienna, Austria. URL <https://www.R-project.org/>.

[^2]: JJ Allaire, et al (2024). _rmarkdown: Dynamic Documents for R_. R package version 2.27. <https://github.com/rstudio/rmarkdown>.

mystyle.css

ul {
    list-style: none; /* Remove list bullets */
    padding: 0;
    margin: 0;
    padding-bottom: 0px;
    font-size: 11pt;
    font-family: 'Aktiv Grotesk';
  }
  
  li {
    padding-left: 0px;
    padding-bottom: 0px; 
    padding-top: 0px;
    font-size: 11pt;
    font-family: 'Aktiv Grotesk';
  }
  
  .myList > ul > li::before {
    content: "/"; /* Insert content that looks like bullets */
    padding-right: 8px;
    padding-top: 0px;
    padding-bottom: 0px;
    color: red; /* Or a color you prefer */
  }