Что такое Rendered Font?

Rendered Font - это расширение Chrome, разработанное newsnepia, и его основная функция - "選択文字列に適用されているフォントを判定します。".

Снимки экрана расширения

Скачать файл CRX расширения Rendered Font

Скачайте файлы расширений Rendered Font в формате crx, установите расширения Chrome вручную в браузере или поделитесь файлами crx с друзьями, чтобы легко установить расширения Chrome.

Инструкции по использованию расширения

■使用方法

フォント判定したい文字列を選択し、右クリックで「Rendered Font」をクリック。
※選択文字列の最初の一文字が判定対象となります。

■ブラウザのフォント適用ロジックについて

フォントはfont-familyに指定された順番で優先的に適用されます。また、フォントに該当の文字列が格納されていない場合は次の優先順位のフォントが適用され、いずれも適用できるフォントが無い場合はブラウザに設定されたデフォルトのフォントが適用されます。
つまり同じ文章でも一文字単位で違うフォントが適用される可能性があるため、フォント判定は任意の一文字を対象にする必要があります。

■フォントの判定プロセス（概要）

< 判定対象文字列の指定 >
１．ブラウザ上で判定対象となる文字列を選択し、右クリックで「Rendered Font」をクリック。選択文字列の最初の一文字が判定対象となります。

< font-familyの取得 >
２．文字列を格納するDOM要素を取得し、window.getComputedStyleで要素に指定されているfont-familyを取得。

< 判定対象の文字列にfont-family中のどのフォントが適用されているかを調べる >
３．テスト用DOM要素を作成し、判定対象の１文字を10個（任意）ほど格納する。
４．まずは２で取得したfont-familyをそのまま適用したときの要素のwidthとheightを調べる
５．次にfont-familyに設定されたフォント名をそれぞれ単独で適用したときのwidthとheightを調べ、４の値と比較し、値が一致したフォントが実際に適用されているフォントであると判定します。

Основная информация о расширении

Название	Rendered Font
ID	keddhhgbmgaoliichbaikplccgefgpep
Официальный URL	https://chrome.google.com/webstore/detail/rendered-font/keddhhgbmgaoliichbaikplccgefgpep
Описание	選択文字列に適用されているフォントを判定します。
Размер файла	21.82 KB
Количество установок	89
Текущая Версия	0.0.1
Последнее Обновление	2018-01-22
Дата публикации	2018-01-22
Рейтинг	5.00/5 Всего 1 оценок
Разработчик	newsnepia
Электронная почта	[email protected]
Тип оплаты	free
Поддерживаемые языки	ja
manifest.json
{ "update_url": "https:\/\/clients2.google.com\/service\/update2\/crx", "manifest_version": 2, "name": "Rendered Font", "version": "0.0.1", "description": "\u9078\u629e\u6587\u5b57\u5217\u306b\u9069\u7528\u3055\u308c\u3066\u3044\u308b\u30d5\u30a9\u30f3\u30c8\u3092\u5224\u5b9a\u3057\u307e\u3059\u3002", "icons": { "16": "img\/icon16.png", "48": "img\/icon48.png", "128": "img\/icon128.png" }, "browser_action": { "default_icon": { "16": "img\/icon16.png", "48": "img\/icon48.png" } }, "background": { "scripts": [ "js\/background.js" ] }, "content_scripts": [ { "matches": [ "http:\/\/\/", "https:\/\/\/", "file:\/\/\/\/" ], "css": [ "css\/style.css" ], "js": [ "js\/content.js" ], "run_at": "document_end" } ], "web_accessible_resources": [ "img\/bt_close.svg" ], "permissions": [ "activeTab", "contextMenus" ] }