Question

我正在尝试为幻灯片创建模板。我使用reveal.js作为我的框架。我在Rstudio中使用了slidify包。

我已将以下文字保存为assets/layouts中的html文件：

---
layout: slide
---
{{{ slide.content }}}

<style>
  p {
    color: #00BFFF;
  position: relative;
    line-height: 1;
}

</style>

对于我想要这种风格的幻灯片，我将它们标记为：

--- &test

### a header

some text

不幸的是，这会更改演示文稿中每张幻灯片的文本格式，即使我没有将&test添加到幻灯片分隔符的文本格式。唯一不会更改的文字是包含在<p> text </p> HTML标记中的文字。

感谢。

Answer 1

当您在slidify中编写布局时，模板会被填入并包含在html文件中，因此您的样式块将全局应用于html文件中的所有内容。

解决这个问题的方法是将其限制在特定的类中：

如果test.html包含以下内容：

<section class='test {{slide.class}}' data-state='{{slide.ds}}' id='{{slide.id}}' data-background='{{slide.bg}}' data-transition='{{slide.dt}}' background-transition='{{slide.bt}}'>
  {{{ slide.header }}}
  {{{ slide.content }}}
  {{# slide.pnotes }}
  <aside class='notes'>
    {{{ html }}}
  </aside>
  {{/ slide.pnotes }}
</section>
<style>
  .test p {
   color: #00BFFF;
   position: relative;
   line-height: 1;
   }

然后段落样式将仅适用于由--- &test表示的幻灯片中的段落。

为slidify创建幻灯片模板

1 个答案: