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/