Anki のカードの背景をストライプにする方法を紹介します。
方法と言っても、[書式] のところに 以下のCSSを書くだけです。
.card {
/* 省略 */
background-color: #b2e0f0; // 薄い方の色
background-size: auto auto;
background-image: repeating-linear-gradient(180deg, transparent, transparent 1px, #8cd1e8 2px, #8cd1e8 8px);
/* 省略 */
}
.card
のところに記述します。
こんなふうになります。
この場合、文字が見づらくなってしまうので、文字の部分だけ白い背景にしてあります。
そうする場合は、まず 表面や裏面のテンプレートで、こんなふうにクラス属性を指定したタグ(今回は <p>
)でフィールドを囲んでおきます。
<p class="box">{{表面}}</p>
続いて、[書式] のところで、このクラスのスタイルを記述します。
.box {
background-color: white;
padding: 10px 5px;
border-radius: 5px;
}