point HTMLの書き方 その2

HTML文書を再編集する

皆さんはブラウザに表示された内容を見て何か変だと思いませんか?
そう、改行がされていないのです。ブラウザに改行を表示するには、改行したい部分に<br>タグを入力する必要があります。この<br>タグには終了タグが無く、単体で使用します。

それでは、先ほどのHTML文書をメモ帳で開いて再編集してみましょう。Internet Explorerのメニューバーの「表示」をクリックし「ソース」を選択するか、画面上の何もないところで右クリックして、メニューから「ソースの表示」を選択します。これでメモ帳が起動します。 では、下記のように「〜出来ました。」の後ろに<br>を入力してみて下さい。

HTML
<html>
<head>
<title>オイラのホームページ</title>
</head>
<body>
ホームページが出来ました。<br>
自分のホームページが世界中の人に見られる日も近いかな?
</body>
</html>
 

再編集した内容を保存

再編集した内容を保存します。再編集した内容をブラウザ上に表示するには、再編集した内容をまず保存する必要があります。メモ帳のメニューバーの「ファイル」をクリックし「上書き保存」を選択します。 次にブラウザのメニューバーの「表示」をクリックし、「最新の情報に更新」を選択するか、ツールバーの「更新」をクリックします。 下記のような改行された文書が表示されましね。

オイラのホームページ - Microsoft Internet Explorer
ホームページが出来ました。
自分のホームページが世界中の人に見られる日も近いかな?

文字を太くしてみる。

先ほどのHTML文書をメモ帳で開きます。 文字を太くするには<b>〜</b>で、太くしたい文字の範囲を囲みます。とりあえず、一行目のホームページの部分を囲ってみますね。

再編集した内容をまず保存し、ブラウザで確認してみます。ホームページの部分が太文字になりましたヽ(^o^)丿

HTML
<html>
<head>
<title>オイラのホームページ</title>
</head>
<body>
<b>ホームページ</b>が出来ました。<br>
自分のホームページが世界中の人に見られる日も近いかな?
</body> </html>
 

オイラのホームページ - Microsoft Internet Explorer
ホームページが出来ました。
自分のホームページが世界中の人に見られる日も近いかな?

リンクを貼ってみる

次はリンクを貼ってみましょう♪インターネットの醍醐味、ポチッとクリックすれば、 あちこちのサイトに訪問できる便利なリンクです。ポチッとクリックするだけで、欲しいのもが買えちゃう事もありますけどねー(^_^;)

他サイトにリンクするには、<a>タグのhref属性を使ってアドレスを指定すれば可能。自分のホームページのテキストにヤフーのリンクを貼りたければ、ヤフーのアドレスhttps://www.yahoo.co.jp/を使ってこのように記入します。

<a href="https://www.yahoo.co.jp/">自分のホームページ</a>

HTML
<html>
<head>
<title>オイラのホームページ</title>
</head>
<body>
<b>ホームページ</b>が出来ました。<br>
<a href="https://www.yahoo.co.jp/">自分のホームページ</a>が世界中の人に見られる日も近いかな?
</body>
</html>
 

オイラのホームページ - Microsoft Internet Explorer
ホームページが出来ました。
自分のホームページが世界中の人に見られる日も近いかな?

まとめ

このページと前のページではホームページを作るための作業手順や、基礎的なタグを使ってのHTML文書の書き方について説明しましたが、皆さん理解できたでしょうか??

このようにメモ帳などのテキストエディタを使ってホームページを作るには、HTML文書をテキストエディタで開いてタグや文章を記入し、それを保存してからブラウザでどのように表示されるかを確認し、またテキストエディタに新たにタグや文章を記入しながら間違いを訂正していく、この手順の繰り返しです。

このページでは、文字を太くする<b>タグなどを紹介しましたが、<b>〜</b>のようにタグは基本的に指定したい範囲を<開始タグ名>〜</終了タグ名>で囲むだけでいいのです。

例外的に<br>タグみたいにピンで使うものもありますが、多くのタグは終了タグを記入します。タグって簡単♪と思いません?

後はタグで指定される命令の効果や意味を一つ一つ覚えていくだけいいのです。次のページからは文章に見出しをつけたり、中央揃えするタグなどを紹介していきます。

少しずつタグを覚えていって、いつかはホームページの管理人になれるように頑張って勉強しましょう。

スポンサード・リンク