↓ここにキーワードを入力してください。

HTMLを使ってホームページを作ってみよう！ 2/2

このままでは横長の文字の羅列になってしまうので、改行したい部分に と記述します。

<html>
<head>
<title>愛犬コテツの成長日記</title>
</head>

<body>
愛犬コテツの成長日記 
 
わたしの愛犬コテツの成長をつづったページです。 
 
コテツの誕生日 
1年目 
2年目 
コテツのすきなものきらいなもの 
コテツのおともだち 
</body>

</html>

つぎにタイトルの文字サイズを変更します。文字のサイズは、サイズを指定しない場合を基準に+3～+1、-1～-3の7種類があります。+3がいちばん大きく、+2、+1、基準、-1、-2、-3の順に小さくなっていきます。ここでは、タイトルの部分を～でくくります。

<html>
<head>
<title>愛犬コテツの成長日記</title>
</head>

<body>
愛犬コテツの成長日記 
 
わたしの愛犬コテツの成長をつづったページです。 
 
コテツの誕生日 
1年目 
2年目 
コテツのすきなものきらいなもの 
コテツのおともだち 
</body>

</html>

画像を表示させます。タイトルの下に画像を表示させたい場合、タイトルのあとに<img src="**">と記述します。**の部分には前準備で作成した「image」フォルダの中にある画像のファイル名を記述してください。

<html>
<head>
<title>愛犬コテツの成長日記</title>
</head>

<body>
愛犬コテツの成長日記 
 
<img src="image/dog.jpg">
 
わたしの愛犬コテツの成長をつづったページです。 
 
コテツの誕生日 
1年目 
2年目 
コテツのすきなものきらいなもの 
コテツのおともだち 
</body>

</html>

このままでは基本の左揃えのレイアウトになってしまうので中央揃えにしたい部分を<center>～</center>でくくります。

<html>
<head>
<title>愛犬コテツの成長日記</title>
</head>

<body>
<center>
愛犬コテツの成長日記 
 
<img src="image/dog.jpg">
 
わたしの愛犬コテツの成長をつづったページです。 
 
コテツの誕生日 
1年目 
2年目 
コテツのすきなものきらいなもの 
コテツのおともだち 
</center>
</body>

</html>

はじめてのホームページ講座(3)

応用と豆知識

次へ
（応用と豆知識タグのひと工夫）

前へ
（HTMLを使ってホームページを作ってみよう！ 1/2）