前言
Anki 是一款卡片式的记忆辅助软件。软件在保持轻巧简洁的同时，各种设置也很丰富。另外， Anki 通过嵌入式的网页来展示卡片，大大增强了卡片样式的自定义功能。下面是目前自己常用的卡片样式代码，有折腾闲情的可以试试。
基础模板
标题居中，用不同背景色区分答案类型，设置圆角等样式。
模板使用区域
- 主要需要填写如图所示4个区域。
正面模板
1
2
| <img src="{{logo}}" class="logo"/>
<div style="font-size:2em">{{Front}}</div>
|
样式
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
| .card {
font-family: 方正中雅宋_GBK;
font-size: 1em;
text-align:center;
}
.logo {
width: 9em;
padding: 2em 0 1em;
}
.English {
font-family: 方正中雅宋_GBK;
font-size: 1.5em;
text-align: justify;
background-color: #ffe4f4;
border-radius: .3em;
padding: 1em;
}
.Chinese {
font-family: 方正中雅宋_GBK;
font-size: 1.5em;
text-align: justify;
background-color: #edffc4;
border-radius: 1.2em .3em;
padding: 1em;
}
|
背面模板
1
2
3
4
5
6
| {{FrontSide}}
<hr id=answer>
<div class= Chinese>{{Chinese}}</div>
<p>
<div class= English>{{English}}</div>
|
带页脚模板
加了页脚，左下显示标签分类信息，右下链接到设定的网址。
模板使用区域
正面模板
1
2
3
4
| <div class= item_eng>{{Item_ENG}}</div>
<p class= front>{{Front}}</p>
<p class= title>{{Tags}}</p>
<p class= author>M.ZH</p>
|
样式
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
| .card {
font-family: 方正中雅宋_GBK;
font-size: 1em;
text-align: center;
}
.Chinese {
font-family: 方正中雅宋_GBK;
font-size: 1.5em;
text-align: justify;
background-color: #edffc4;
border-radius: 1.2em 0.3em;
padding : 0.5em;
}
.English {
font-family: 方正中雅宋_GBK;
font-size: 1.5em;
text-align: justify;
background-color: #ffe4f4;
border-radius: .3em;
padding: .5em;
}
.front {
font-size: 1.8em;
}
.item_eng {
padding-top : 5%;
color: orange;
font-size: 2em;
}
.tag {
display: block;
position: fixed;
left: 3%;
bottom: 0;
color: gray;
font-size: 1.1em;
}
a {
color: grey;
}
.title {
display: block;
position: fixed;
left: 3%;
bottom: 0;
color: gray;
font-size: 1em;
}
.author {
display: block;
position: fixed;
right: 3%;
bottom: 0;
color: gray;
font-size: 1em;
}
.link {
display: block;
position: fixed;
right: 3%;
bottom: 0;
color: gray;
font-size: 1.1em;
font-style: italic;
}
|
背面模板
1
2
3
4
5
6
7
8
9
10
| <div class= item_eng>{{Item_ENG}}</div>
<p>
<p class= front>{{Front}}</p>
<hr id= answer>
<div>{{image}}</div>
<p class= Chinese>{{Chinese}}</p>
<p>
<p class= English>{{English}}</p>
<a href="{{Link}}"><p class=link>Reference Site</p></a>
<p class= tag>{{Tags}}</p>
|
字体下载
测试了不少字体，感觉 方正中雅宋_GBK 和这个软件最匹配。当然，大家可以自行修改font-family，换用喜欢的字体。
