slidev-theme-aircraft-pre1

学前阶段航模课程主题

开头配置

---
theme: "@echmo/slidev-theme-aircraft-pre1"
transition: fade
download: false
export: false
browserExporter: false
colorSchema: light
fonts:
    mono: Cherry Bomb One
---

常用方法

嵌入图片

<img src="/assets/example/book.png" h-36 border-2/>

<ImgLabel label="好吃的">
    <img src="/assets/example/book.png" h-36 border-2/>
</ImgLabel>

布局

通过在小节前添加 layout: 布局名称 来设置布局

---
layout: name
---

封面

第一页默认是这个布局

---

# 课题

---

小节布局

---
layout: section
---

# - 02 -

## 布局

---

默认布局

不指定时使用这个布局

两列布局

---
layout: two-cols
---

# 标题

::left::

这是左边

::right::

这是右边
---

居中布局

---
layout: center
---

# 居中布局

::center::

<img src="/assets/example/img.webp" w-48/>
---

左侧图片布局

---
layout: image-left
image: /assets/example/img.webp
---

# 标题

这是图片左侧布局

---

右侧图片布局

---
layout: image-right
image: /assets/example/img.webp
---

# 标题

这是图片右侧布局

---

总结布局

---
layout: summary
---

## 这些课我们学习了如何...

## 这些课我们学习了如何...

## 这些课我们学习了如何...

---

iframe布局

---
layout: iframe
url: https://sli.dev/
---

---

纯色布局

---
layout: none
class: bg-blue-400 text-white
---

# 标题

这纯色背景布局，可以通过class属性设置背景颜色

---

全屏布局

---
layout: full
---

<Video>
    <source src="" />
</Video>
---

结束

在最后一页指定 end 布局来添加结束页

---
layout: end
---

组件

组件是一些具有集成样式和功能的元素，使用大写字母开头的标签

字体

<BigText>特别大的字</BigText>

把一部分字体<Text>突出</Text>显示

知识卡片

<Knowledge>使用Knowledge组件来创建知识卡片</Knowledge>

动手实践

<Try>使用Try组件来创建“动手尝试”卡片</Try>

提问

<Question>
    你知道地球距离月球有多远吗？
</Question>

标签

<Badge>使用Badge组件来创建标签</Badge>

选择题

<Choice>
    <template v-slot:question>
        下面哪个说法是正确的?
    </template>
    <template v-slot:choices>
        <div>
            <span mr-4 v-mark.highlight.green="1">A</span>
            正确的选项        
        </div>
        <div>
            <span mr-4 v-mark.highlight.red="2">B</span>
            错误的选项        
        </div>
        <div>
            <span mr-4 v-mark.highlight.red="3">C</span>
            错误的选项        
        </div>
        <div>
            <span mr-4 v-mark.highlight.green="4">D</span>
            正确的选项        
        </div>
    </template>
</Choice>

created by echmo