Documents in Vivliostyle Pub are created using a notation called Markdown. Here, we will introduce only the main notations. For details, please refer to the following:
- Special Feature: Let's Create a Doujinshi with Create Book!
- Introduction to VFM Summer 2021
- Vivliostyle Flavored Markdown
There are six levels of headings. From the largest heading #
to the smallest ######
, the more hashes, the lower the level of the heading. Please write the heading text with a space after the hash.
# Heading 1
## Heading 2
### Heading 3
#### Heading 4
##### Heading 5
###### Heading 6
There are three types of lists: lists with *
, -
, or +
at the beginning (disc), lists with numbers and periods (decimal), and checkboxes. Note that in numbered lists, it is not necessary to write the numbers in order. They will be rendered in descending order from the first number.
## Disc List
* The ball that is hit high enters the clouds and falls back into the hands of the person (Shiki Masaoka)
- The ball that is hit high enters the clouds and falls back into the hands of the person (Shiki Masaoka)
+ The ball that is hit high enters the clouds and falls back into the hands of the person (Shiki Masaoka)
## Decimal List
1. The ball that is hit high enters the clouds and falls back into the hands of the person (Shiki Masaoka)
1. The ball that is hit high enters the clouds and falls back into the hands of the person (Shiki Masaoka)
2. The ball that is hit high enters the clouds and falls back into the hands of the person (Shiki Masaoka)
## Checkbox List
- [ ] The ball that is hit high enters the clouds and falls back into the hands of the person (Shiki Masaoka)
- [x] The ball that is hit high enters the clouds and falls back into the hands of the person (Shiki Masaoka)
There are two types of emphasis. Enclosing text with *
makes it italic, and enclosing it with **
makes it bold. In HTML notation, the former corresponds to the em element and the latter to the strong element.
## Emphasis
### em Element
"Hey, criminals. *This spider's thread is mine. Who did you ask to climb up?* Get down. Get down." he shouted. At that moment, the spider's thread, which had been fine until then, suddenly snapped from where Kandata was hanging.
### strong Element
"Hey, criminals. **This spider's thread is mine. Who did you ask to climb up?** Get down. Get down." he shouted. At that moment, the spider's thread, which had been fine until then, suddenly snapped from where Kandata was hanging.
Enclosing text with ~~
makes it strikethrough.
## Strikethrough
"Hey, criminals. ~~This spider's thread is mine. Who did you ask to climb up?~~ Get down. Get down." he shouted. At that moment, the spider's thread, which had been fine until then, suddenly snapped from where Kandata was hanging.
In the format [string](URL)
, the "string" part can be made clickable. Writing the URL directly also makes it clickable. You can also write embedded elements such as Twitter and YouTube.
## Links
[Vivliostyle](https://vivliostyle.org/) is an open-source project that creates a new typesetting system for electronic publishing and web publishing using the latest web standard technologies.
https://vivliostyle.org/
<blockquote class="twitter-tweet" data-partner="tweetdeck"><p lang="en" dir="ltr">
We released Vivliostyle CLI v4.1.0 with Vivliostyle.js v2.9.1.<br>✅Support the @ supports CSS at-rule (feature queries)<br>
✅MathJax Content MathML extension is enabled<a href="https://t.co/Me1coX2Hlp">https://t.co/Me1coX2Hlp
</a></p>— Vivliostyle (@Vivliostyle) <a href="https://twitter.com/Vivliostyle/status/1436735010921332736?ref_src=twsrc%5Etfw">
September 11, 2021</a></blockquote>
<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
Ruby can be written in the format {base|ruby}
. Please note that half-width characters are used instead of full-width characters.
## Ruby
- {打|う}ち{揚|あ}ぐる ボールは{高|たか}く{雲|くも}に{入|い}りて {又|また}{落|お}ち{来|きた}る{人|ひと}の{手|て}の{中|なか}に(正岡子規)
- マッチ{擦|す}る つかのま{海|うみ}に{霧|きり}ふかし {身捨|みす}つるほどの{祖国|そこく}はありや(寺山修司)
- {友|とも}がみな われよりえらく{見|み}ゆる{日|ひ}よ {花|はな}を{買|か}ひ{来|き}て{妻|つま}としたしむ(石川啄木)
- ああ{皐月|さつき} {仏蘭西|ふらんす}の{野|の}は{火|ひ}の{色|いろ}す {君|きみ}も{雛罌粟|こくりこ}われも{雛罌粟|こくりこ}(与謝野晶子)
You can create tables by enclosing the text in cells with |
. By inserting a row with cell text as |-----|
in the second row, you can make the first row a header.
## Tables
| Header1 | Header2 | Header3 |
| ------ | ------- | ----- |
| Column1 | Column2 | Column3 |
| Column4 | Column5 | Column6 |
Unfortunately, vertical writing cannot be expressed in Markdown yet. Use the HTML span element and the tcy attribute <span class="tcy">
and the closing tag </span>
to enclose the numbers.
## Tategaki (Vertical Writing)
The village of Hayama was born through a merger, but <span class="tcy">36</span> years later, in Taisho <span class="tcy">14</span>
(<span class="tcy">1</span><span class="tcy">9</span><span class="tcy">2</span><span class="tcy">5</span>), on January <span class="tcy">1</span>, it became "Hayama Town" without merging again. The range of Hayama Town is the same as that of Hayama Village 320 years ago, and at the same time, it coincides with the range of the six villages in the Edo period, making it a rare example in Japan.
## Image Captions and Size Specification
{width=100%}