javascript – 如何在ipython / jupyter笔记本中修改reveal.js幻灯片设置

前端之家收集整理的这篇文章主要介绍了javascript – 如何在ipython / jupyter笔记本中修改reveal.js幻灯片设置前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我正在使用jupyter / i Python笔记本编写reveal.js幻灯片.我想更改一些默认设置是一个简单的方法.我已经管理的事情(万一有人帮助)

改变主题

通过添加包含的原始单元格来更改主题

  1. <link rel="stylesheet" href="reveal.js/css/theme/sky.css" id="theme">

2.更改transparent.js配置

nbconvert的问题是它在所有单元格语法之后加载了reveal.js,因此只需添加< script> Reveal.configure(…)< / script>以同样的方式不起作用(显示仍将是未知数).解决方案是确保在文档加载后执行代码

  1. <script type="text/javascript">
  2.  
  3. $(document).ready(function(){
  4.  
  5. Reveal.configure({
  6. transition: 'convex' // none/fade/slide/convex/concave/zoom
  7. })
  8. });
  9. </script>

改变别的东西

这是我失败的地方

如何设置片段的行为或特定幻灯片的背景?

解决方法

也许这有点晚了

虽然其中有些不起作用,但是我从同一个博客中发现了另外一篇文章Customizing your IPython slides,可能是你要求的.

custom.css仍然适用于我(与Jupyter 4和Revealjs 3.0.0).只需将custom.css文件放在.html所在的目录中.

改变字体(记住’.reveal’):

  1. .reveal p {
  2. font-family: 'Raleway',sans-serif;
  3. color: #2d28cc;
  4. }

添加背景(但主题背景颜色将消失,也许需要更多的CSS调整):

  1. body {
  2. background: url(logo.png)
  3. no-repeat
  4. left center;
  5. padding: 5px 0 5px 25px;
  6. }

要将东西添加到特定幻灯片,我将使用自定义div,例如:

  1. div.footer {
  2. font-size:14pt;
  3. font-style: italic;
  4. color: #4aaeee;
  5. text-align: center
  6. }

然后将其添加到jupyter单元格:

  1. <div id="footer">...</div>

希望这有帮助〜

猜你在找的JavaScript相关文章