Google Fonts APIを利用すると
上の画像のような形で文字を表示することができます
Webアプリケーションをつくって実行する手順はこちら
コード.gs
function doGet() { return HtmlService.createHtmlOutputFromFile('index'); } |
意訳.gsこの処理は以下を実行する 指定したファイルのHTMLを表示する |
index.html
<html> <head> <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Tangerine"> <style> .ta { font-family: 'Tangerine', serif; font-size: 48px; text-shadow: 4px 4px 4px aqua; color: blue; } </style> </head> <body> <textarea class="ta">Hello</textarea> </body> </html> |
意訳ここからhtml ここからhead linkタグで指定したフォントを読み込む(例ではTangerine) ここからstyle taクラスの設定 font-familyを設定 font-sizeを設定 text-shadowを設定 colorを設定 ここまでstyle ここまでhead ここからbody textareaのclassにtaを指定し、Helloを入れる ここまでbody ここまでHTML |
試してみる
例ではテキストエリアを作ったので
何か入力すると同じフォントで表示されます
参考
Get Started with the Google Fonts API
https://developers.google.com/fonts/docs/getting_started
Fonts List
https://fonts.google.com/
Google Fonts
https://developers.google.com/fonts/
Google Fonts + 日本語 早期アクセス
https://googlefonts.github.io/japanese/
Get Started with the Google Fonts API
https://developers.google.com/fonts/docs/getting_started
Fonts List
https://fonts.google.com/
Google Fonts
https://developers.google.com/fonts/
Google Fonts + 日本語 早期アクセス
https://googlefonts.github.io/japanese/