Start with reveal.js

reveal.js with markdown

0. Installation

0–1 Reveal.js extension in vscode:

0–2 Open a new folder & create a index.md file

0–3 Write some basic setting for your reveal.js:

---

theme : "night"
transition: "slide"
highlightTheme: "monokai"
# logoImg: "logo.png"
slideNumber: true
title: "YOUR TITLE"

---

### YOUR TITLE
<style>
pre {
background: #303030;
padding: 10px 16px;
border-radius: 0.3em;
counter-reset: line;
}
pre code[class*="="] .line {
display: block;
line-height: 1.8rem;
font-size: 1em;
}
pre code[class*="="] .line:before {
counter-increment: line;
content: counter(line);
display: inline-block;
border-right: 3px solid #6ce26c !important;
padding: 0 .5em;
margin-right: .5em;
color: #afafaf !important;
width: 24px;
text-align: right;
}
.reveal .slides > section > section {
text-align:left;
}
h1,h2,h3,h4 {
text-align: center
}
p {
text-align: center;
}
</style>

hackmd link

In this setting,

Horizontal page:

---

Vertical page:

--

And other usages are just like you markdown format. But remember to leave one line with each page.

For example:

--- 
### page a
--
### page a-1
---
### page b
---