# 练习页面
# 链接
输入
内部链接：
[快速上手](/zh/guide/start.md)
外部链接：
[GitHub](https://github.com/eastonyangxu/vuepress_template)
1
2
3
4
2
3
4
点击链接：快速上手 GitHub (opens new window)
官方案例
官方文档： 链接 (opens new window)
# GitHub风格表格
输入
| Tables | Are | Cool |
| ------------- | :-----------: | ----: |
| col 3 is | right-aligned | $1600 |
| col 2 is | centered | $12 |
| zebra stripes | are neat | $1 |
1
2
3
4
5
2
3
4
5
输出
| Tables | Are | Cool |
|---|---|---|
| col 3 is | right-aligned | $1600 |
| col 2 is | centered | $12 |
| zebra stripes | are neat | $1 |
# Emoji
输入
:tada: :100: :orange: :houses: :car: :boy: :clock3: :no_entry_sign:
1
输出
🎉 💯 🍊 🏘 🚗 👦 🕒 🚫
参考列表： emoji列表 (opens new window)
# 目录
输入
[[toc]]
1
输出(本页的目录)
# Escaping
默认情况下，块级 (block) 的代码块将会被自动包裹在 v-pre 中。如果你想要在内联 (inline) 的代码块或者普通文本中显示原始的大括号，或者一些 Vue 特定的语法，你需要使用自定义容器 v-pre 来包裹:
输入
::: v-pre
`{{ This will be displayed as-is }}`
:::
1
2
3
2
3
输出
{{ This will be displayed as-is }}
# 部署到Github Pages
# 自定义components
输入
demo.vue
<style scoped lang="css">
h1 {
color: red;
font-size: 20px;
}
</style>
<template>
<h1>这是我第一个自定义的components</h1>
</template>
<script>
export default {
name: "demo",
};
</script>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
使用componnets：
<demo/>
1
输出