ホーム > web・PC > web制作 > 文字サイズを小さく、文字サイズを大きくするjavascript

文字サイズを小さく、文字サイズを大きくするjavascript

2008年6月27日 22:47 | 個別ページ | コメント(0) | トラックバック(0)

webサイトで文字サイズを変更できるのをたまに見かけます。
簡易的に、文字サイズを小さくしたり大きくしたりするサンプルを作成しました。

文字サイズを小さく、文字サイズを大きくする

サンプルソースコード

文字サイズをクリックする度に小さく、文字サイズをクリックする度に大きくする

なぜかぞえぞえねっとでは、これが動かないのでソースをコピーして実験してみてください。

サンプルソースコード

指定された場所の文字サイズを小さく、文字サイズを大きくする

ここに書かれている文字が変化します。

サンプルソースコード

<input type="submit" value="文字を小さく" onclick="document.getElementById('samplefont').style.fontSize = '70%'" />
<input type="submit" value="文字を大きく" onclick="document.getElementById('samplefont').style.fontSize = '130%'" />
<div id="samplefont">ここに書かれている文字が変化します。</div>

この記事に関連している、 web制作で他の記事も見ることができます。

ブログランキングに参加しています。記事がよかったと思ったらクリックお願いします。
（他のいいブログも探すこともできます。）