css - R Markdown 幻灯片与reveal.js : How to left align list items (bullets and numbers)?

Question

我该怎么办将列表项与幻灯片的左页边距对齐 ?

看来revealjs始终使用最长的列表项文本，将其居中放在幻灯片上，然后左对齐此列表项下的所有其他列表项:

---
title:
output: 
        revealjs::revealjs_presentation
---

## list items
* a
* picture
* says more
* than a thousand words

or

1. item 1
1. item 2

我试图在幻灯片标题后嵌入一个 CSS 样式表，但是
它没有影响:

<style type="text/css">
  .reveal li {
    text-align: left;
  }
</style>

PS:我将 RStudio 与 revealjs 一起使用包裹。

Answer 1

我找到了解决办法。
为了获得一致的布局，我不仅左对齐无序和有序列表项，还使用以下嵌入样式左对齐文本段落:

---
title:
output: 
        revealjs::revealjs_presentation
---

## list items

<style type="text/css">
  .reveal p {
    text-align: left;
  }
  .reveal ul {
    display: block;
  }
  .reveal ol {
    display: block;
  }  
</style>

* a
* picture
* says more
* than a thousand words

or

1. item 1
1. item 2

资料来源:

您可以浏览revealjs定义的样式列表以找出事件属性值:
https://github.com/hakimel/reveal.js/blob/master/css/theme/template/theme.scss

检查不同属性值的语义以找到所需的布局，例如。 G。为 display属性(property):
http://www.w3schools.com/cssref/pr_class_display.asp