模板测试文本 Markdown
这是一篇主题样式测试文章,涵盖 header/link/img/footnotes/hr/code/pre code/blockquote/bold/italic/table/list/toc 的样式。这篇文章的作者是水八口,一个根正苗红的好人。
这是二级标题
二级标题通常用于文章内部的结构梳理,除此之外还有三级至六级标题1。而一级标题一般情况下会是文章标题,所以文章内部最好不要使用一级标题,以防与文章标题重叠,产生不美观的结构。
这是三级标题
二级标题所描述的内容中,若还需要细分,可以使用三级标题,甚至四级标题。
这是四级标题
一般来说我只使用二级和三级标题,能用到四级标题的情况非常少,更别说五级和六级标题了。如果开启了 TOC 功能,这些级别的标题就会自动生成目录,显示在页面的某处,方便读者快速掌握文章脉络和跳步阅读。
图片
如果说博客中最常见的是文字(段落),那么第二重要的应该要数图片了。成语里有个词叫做“图文并茂”,看来非常有必要测试一下图片的显示样式了。
通常写法
![这是 alt](https://i.imgur.com/ob1lPK4.jpg '这是可写可不写的 title')
figure 写法
<figure>
<img src="https://i.imgur.com/ob1lPK4.jpg" alt="这是 alt" />
<figcaption>这是可写可不写的 figcaption</figcaption>
</figure>
来看看 w3schools 是如何定义 figure
和 figcaption
的。
The <figure> tag specifies self-contained content, like illustrations, diagrams, photos, code listings, etc.
The <figcaption> tag defines a caption for a <figure> element.
-- w3school
由于 figure 写法在 css 上更有发挥空间,加上 figcaption
的助攻,让图片显示更加友好,所以再很早之前我就全部统一为这种写法2。
表格
标题一 | 标题二 | 标题三 |
---|---|---|
1.1 我是一个粉刷匠,粉刷本领强 | 1.2 | 1.3 我是一只来自北方的狼 |
2.1 come on be my baby come on | 2.2 | |
3.1 我是一个兵,爱着老百姓 | 3.3 baby baby baby oh my baby lalalalla | |
4.1 thiswordisveryveryloooooooooooooooooooooooooooooooooooooooooooong |
列表
这是一个无序列表
- 项目
- 子项目
- 子项目
- 项目
- 项目
- 子项目
- 子项目
这是一个有序列表
- 项目一
- 子项目
- 项目二
- 项目三
- 子项目
这是一个 to-do list
- 已完成
- 未完成
- 未完成
代码块
代码无行数:
extends index
block title
title= '搜索 - ' + site.title
block content
h2 搜索
// 请出搜索框
#search
+posts.search_in_html(placeholder='搜索', base_url='/search')
// 如果有搜索结果
if request.args.s
#result
// 定义搜索结果文章列表,取30篇,后面调用了分页,所以这里表示每页显示30篇
search_posts = posts.search(keywords=request.args.s, limit=30)
for post in search_posts
h2: a(href=post.url)= post.title
.content= post.content.limit(150)
// 别忘了调用分页
+h.paginator()
代码有行数:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 | extends index
block title
title= '搜索 - ' + site.title
block content
h2 搜索
// 请出搜索框
#search
+posts.search_in_html(placeholder='搜索', base_url='/search')
// 如果有搜索结果
if request.args.s
#result
// 定义搜索结果文章列表,取30篇,后面调用了分页,所以这里表示每页显示30篇
search_posts = posts.search(keywords=request.args.s, limit=30)
for post in search_posts
h2: a(href=post.url)= post.title
.content= post.content.limit(150)
// 别忘了调用分页
+h.paginator()
|