Tools

Anki カードの背景をストライプにする

投稿日:2021年9月19日 更新日:

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;
}

📂-Tools
-

執筆者:labo


comment

メールアドレスが公開されることはありません。

関連記事

Git

Git で管理を始める時に実行するコマンド

あるディレクトリを Git でバージョン管理する場合に、最初に実行しているコマンドを紹介します。 (1) Git で管理するディレクトリに移動 $ cd path/to/dir (2) Git管理開始 …

Windows

wsl-terminal を更新する

目次1. はじめに2. 環境3. バージョン4. 作業1. エクスプローラーのコンテキストメニュー2. 既存の wsl-terminal ディレクトリを退避3. 最新版 wsl-terminal の導 …

ICTリテラシー

複数のGIFファイルを一括でPNGファイルに変換する

複数のGIFファイルを一括でPNGファイルに変換する方法を紹介します。

Windows

Putty でスクリーン上のやりとりをログファイルに保存する方法

目次1. はじめに2. Putty でログをとる手順3. ログファイルが既に存在していた場合の挙動設定4. おわりに 1. はじめに PuTTY とは、Windows用のターミナルエミュレータです。 …

Evernote

【Evernote】検索でヒットするはずのノートが、ヒットしない場合の対処法

【Evernote】検索しても、特定のノートがヒットしない場合の対処法について説明します。