Tools

Anki のカードに背景画像を設定する

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

Anki のカード(テンプレート)に背景画像をセットする手順を紹介します。

(1) 背景画像にする画像ファイルを用意します。

(2) そのファイル名の先頭に “_” (アンダーバー) を付けます。

foo.png という画像ファイル名であれば、_foo.png とします。

この画像ファイルはカードの背景に使うだけであり、フィールドの中に記述するわけではありません。
Anki: テンプレート内でのみ使う画像ファイルとマスターとしての画像ファイル でも書いたように、フィールドで使用されていない画像ファイルは、「メディアをチェック」操作によって削除される可能性があります。しかし、ファイル名の先頭が “_” になっているファイルはその対象外となります。

(3) この画像をクリップボードにコピーし、適当なノートのフィールドに貼り付けてから削除します。

この操作により、画像ファイルが「C:\Users\{user_name}\AppData\Roaming\Anki2\{anki_account_name}\collection.media」フォルダ内(Windows の場合)にコピーされます。ここに画像ファイルを配置することが目的なので、フィールドからは削除しています。

(4) カードのテンプレートの「書式」に、以下のCSSを記述します。

※ 画像ファイル名は、_foo.png としてあります。

.card { 
  background-image: url("_foo.png"); 
}

以上です。

📂-Tools
-

執筆者:labo


comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

関連記事

Git

ファイル(もしくはディレクトリ)を Git による管理から外す手順

Git を使ってファイルやディレクトリの履歴を管理してきたけれど、特定のファイル(もしくはディレクトリ)を Git による管理から外す場合の手順です。 1. ファイル ファイルを実際に削除しつつ、イン …

Vim

vi (vim) の終了手順について

私の vi (vim) 終了手順について書いています。

WSL

WSL (または WSL 2) から外付けストレージ側にアクセスできない場合の対処方法

WSL (または WSL 2) で外付けストレージ側に移動できない場合の対処方法を紹介します。

Git

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

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

Web Programming

Webブラウザ上でHTML/CSS/JavaScriptを書いて試すことができるサービスの比較

目次はじめにサービス比較CodePenjsdo.itJSFiddleObservableまとめ はじめに Webブラウザ上で、HTML/CSS/JavaScript を書き、それをその場で実行したり保 …