超初心者でも簡単!あなたもできるHP作成!− Make easily  
|| トップページ || HTML || Style Sheet || リファレンス || Web素材 || Contact Us || サイトマップ || 初めての方 || 
フォントの詳しい説明は「リファレンス−フォント」を参照してください。

文字の太さを変える

では、文字の太さを変えてみましょう!

まず<例題11>で作ったファイルに<スポンジのつくり方>の文字を追加しましょう。

<例題12>
<html>
<head>
<title>MY HOMEPAGE</title>
</head>
<body>

<center>
<h1>MY HOMEPAGE</h1>
<p>
<img src="cake.jpg">
<p>
<font size="4" color="#0000FF">スポンジのつくり方</font>
<p>
<table width="350" border="1">
<tr>
<td colspan="2" align="center"><材料>(例)18cmの丸型1個分</td>
</tr>
<tr>
<td>卵</td>
<td align="center">3個</td>
</tr>
<tr>
<td>砂糖</td>
<td align="center">90g</td>
</tr>
<tr>
<td>小麦粉</td>
<td align="center">90g</td>
</tr>
<tr>
<td>バター</td>
<td align="center">25g</td>
</tr>
</table>
<p>
<スポンジのつくり方>
</center>

</body>
</html>

まず、 <p> で行を変えて、次に <スポンジの作り方> の文字を書きます。
<スポンジの作り方>の「<」および「>」は半角ではなく、必ず全角で書いてください。
半角で書くと「タグ」とみなされ正しく表示できなくなります。

<スポンジの作り方>の文字を太くしてみましょう。

文字を太くするには <b> </b> で文字をはさみます。

<例題13>
<html>
<head>
<title>MY HOMEPAGE</title>
</head>
<body>

<center>
<h1>MY HOMEPAGE</h1>
<p>
<img src="cake.jpg">
<p>
<font size="4" color="#0000FF">スポンジのつくり方</font>
<p>
<table width="350" border="1">
<tr>
<td colspan="2" align="center"><材料>(例)18cmの丸型1個分</td>
</tr>
<tr>
<td>卵</td>
<td align="center">3個</td>
</tr>
<tr>
<td>砂糖</td>
<td align="center">90g</td>
</tr>
<tr>
<td>小麦粉</td>
<td align="center">90g</td>
</tr>
<tr>
<td>バター</td>
<td align="center">25g</td>
</tr>
</table>
<p>
<b><スポンジのつくり方></b>
</center>

</body>
</html>

ブラウザで表示させると下の画像のようになります。

うまく表示できましたか?

▲このページのトップに戻るTop