带有reveal.js的R Markdown幻灯片:如何左对齐列表项(项目符号和数字)？

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

资料来源:

1. 您可以浏览揭示js定义的样式列表以找出活动属性值:

   https://github.com/hakimel/reveal.js/blob/master/css/theme/template/theme.scss

2. 检查不同属性值的语义以找到所需的布局,例如对于display属性:

   http://www.w3schools.com/cssref/pr_class_display.asp