どうも！LSSです！！
今回は「フォントの表示テスト」を行うだけのスクリプトを書いてみました。
fontテスト
スクリプトのコード
<div id="ftest"></div>
<script>
txts='';
txt='';
fts=['serif','sans-serif','cursive','fantasy','monospace','Verdana','arial','"arial black"','"Times New Roman"','Meiryo','Impact','Roboto'];
for(i=0;i<fts.length;i++){
txts+='.ft'+i+'{font-family:'+fts[i]+';}\n';
txt+='<span class="ft'+i+' othr">'+fts[i]+'<br/>abcABC0123あいうえお柿句卦子</span><br/>\n';
}
txt='<style>\n'+txts+'.othr{font-size:30px;font-weight:normal;}\n</style>\n'+txt;
ftest.innerHTML=txt+'<br/>'+txt.replace(/</g,'<').replace(/\n/g,'<br/>');
</script>
出力結果が長い割に、JavaScriptのコードはだいぶ短いですねｗ
fts=['serif','sans-serif','cursive','fantasy','monospace','Verdana','arial','"arial black"','"Times New Roman"','Meiryo','Impact','Roboto'];
ここに、試したいフォント名を列記しています。
フォント名にスペースが含まれている場合""で括っています。
txt='<style>\n'+txts+'.othr{font-size:30px;font-weight:normal;}\n</style>\n'+txt;
この30pxを書き換えるとフォントサイズが変更でき、normalをboldに変えると全部太字で出力されます。
というのを取り急ぎ作ってみたのは
さじさんの↑の記事を見たからですｗ
さくっと作ってみましたが、フォントサイズや太字、なんなら斜体もブラウザ上で変更できるようにしたほうがよさげですね。
また、フォント名については、
に、かなり大量に載ってました！
和文フォントについては、どのOSのフォントかまで書かれていてありがたいです^^
ってなとこで、今回はこのへんで！
次回もまた、よろしくお願いします^^
