CSS辞典-フォント

フォントでは、フォントの書式、太さ、サイズなどを指定することが出来ます。ここではよく使うスタイルシートをまとめてありますので、組み合わせでオシャレなデザインに作成していきましょう。

CSS(スタイルシート)辞典-フォント

フォントを指定したい

font-family:フォント書体

日本語のMS Pゴシック系に相当するフォント

font
css
.mspgosikku {
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "MS Pゴシック", "MS PGothic", sans-serif;
}
xhtml
<p class="mspgosikku">日本語のMS Pゴシック系に相当するフォントABCDEabcde</p>

日本語の明朝系に相当するフォント

font
css
.myoutyou {
	font-family: "MS P明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
}
xhtml
<p class="myoutyou">日本語の明朝系に相当するフォントABCDEabcde</p>

Top

フォントの太さを指定したい

font-weight:bold

フォントを太字

font

css
.futoji {
	font-weight: bold;
}
xhtml
<p class="futoji">フォントを太字にしてみます</p>

Top

フォントサイズを指定したい

font-size:数字%

標準の大きさです。

font
css
.fontsm {
	font-size: 100%;
}
xhtml
<p class="fontsm">これは100%の大きさです。標準の大きさです。</p>

小さくなります

font
css
.fontss {
	font-size: 60%;
}
xhtml
<p class="fontss">これは60%の大きさです。小さくなります</p>

大きくなります

font
css
.fontsb {
	font-size: 150%;
}
xhtml
<p class="fontsb">これは150%の大きさです。大きくなります</p>

Top

最終更新日: 2013年2月10日