最新要闻

广告

手机

iphone11大小尺寸是多少？苹果iPhone11和iPhone13的区别是什么？

iphone11大小尺寸是多少？苹果iPhone11和iPhone13的区别是什么？

 警方通报辅警执法直播中被撞飞：犯罪嫌疑人已投案

警方通报辅警执法直播中被撞飞：犯罪嫌疑人已投案

家电

  1. 首页
  2. 移动通信
  3. 内容

全球动态:Obsidian 插件（二）：Advanced_Slides 的使用

来源：博客园
目录
  • Advanced Slides 的使用
    • 一、 概述
      • 1、 简介
      • 2、 特征
      • 3、 第一个 PPT
    • 二、 基础语法
      • 1、 水平垂直幻灯片
      • 2、 元素注释
      • 3、 幻灯片注释
      • 4、 块注解
      • 5、 元素动画
      • 6、 内联样式
      • 7、 幻灯片背景样式
      • 8、 演讲者模式
      • 9、 列表动画
      • 10、 画图支持
      • 11、 图标
      • 12、 表情包
      • 13、 图表支持
      • 14、 幻灯片动画
    • 三、 布局
      • 1、 拆分组件
      • 2、 网格组件
        • 2.1 基本语法
        • 2.2 浮动
        • 2.3 属性
          • 2.3.1 背景
          • 2.3.2 边框
          • 2.3.3 动画
          • 2.3.4 不透明度
          • 2.3.5 过滤
          • 2.3.6 旋转
          • 2.3.7 填充
          • 2.3.8 对齐
          • 2.3.9 justify-content
          • 2.3.10 元素动画
          • 2.3.11 总结
    • 四、 模板
      • 1、 基础使用
      • 2、 可选变量
      • 3、 案例
        • 3.1 模板文件
        • 3.2 幻灯片
      • 4、 默认模板
    • 五、 配置选项

Advanced Slides 的使用

一、 概述

1、 简介

Advanced Slides 是 Obsidian 的开源插件，允许您在 Obsidian 中创建基于eveal.js的演示文稿。使用此工具，任何能够在 Obsidian 中创建笔记的人也可以创建漂亮的演示文稿。

其遵循以下理念convention over configuration，这意味着在大多数情况下，只需使用Obsidian Markdown 语法编写一个 Slide 就足够了。


【资料图】

官方文档位置：https://mszturc.github.io/obsidian-advanced-slides

2、 特征

  • 编辑幻灯片时的实时预览
  • 幻灯片的主题支持
  • 嵌入支持 - 在幻灯片中包含其他 Markdown 文档 -![[Note.md#FirstChapter]]
  • 图像支持
    • 通过 Obsidian Synthax 包含图像 -![[picture.jpg]]
    • 管道图像属性 - -![[image.png|100x100]]
  • 块支持 -::: block
  • 脚注支持 -Here"s a footnote[^1]
  • 在 Markdown 中定义样式表 -
  • 通过 frontmatter 将选项传递给 Slide Compiler
  • 注释元素
  • 支持内部链接
    • [[Note]]将在 Presentation 中呈现为普通文本
    • 带别名[[Note|My Note]]
  • Excalidraw 支持
  • 流程图支持

3、 第一个 PPT

官方示例演示文稿：https://liuzhongkun1.github.io/ppt/example/index.html

创建步骤：

  1. 创建幻灯片

  2. 打开实时预览

二、 基础语法

1、 水平垂直幻灯片

要创建水平幻灯片，请使用由两个空行包围的三个破折号。要创建垂直幻灯片，请使用两个空行包围的两个破折号：

# Slide 1---# Slide 2.1--# Slide 2.2

2、 元素注释

用来设置元素的样式

text with border text with background text with attribute

3、 幻灯片注释

您可以通过注释为整个幻灯片传递样式或类属性：

# Header with coral background colorParagraph has coral background color, too!---- All Bullet points- have green- background color

4、 块注解

可以使用块注释对幻灯片的各个部分进行分组。通过对代码块进行注释，该代码块中的所有项目都将获得注释的属性:

::: block#### Header_and_Paragraph content*in same block*:::---no color::: block everything inside this block has red background color::: block blue:::red:::no color

5、 元素动画

用于突出显示或逐步显示幻灯片上的单个元素。在移动到下一张幻灯片之前，将逐步执行具有类片段的每个元素。默认片段样式是从不可见开始淡入。可以通过将不同的类附加到片段来更改此样式。

Fade in Fade out Highlight red Fade in, then out Slide up while fading in ---- Permanent item- Appear Fourth - Appear Third - Appear Second - Appear First

常见的动画样式：https://revealjs.com/fragments/

6、 内联样式

你可以在你的标记中定义 css 样式：

  1. 通过使用

关键词： 水平垂直 可以使用