記事の紹介

この記事ではHTMLの基本のルールに対して扱いします。

HTMLファイルの生成

HTMLの言語を本格的に学ぶ前に基本的なHTML言語の実行環境を備えましょう。

・まず、Windowの方は場合はノートパッド、Macの方はテキストエディタ開きます。

Windowの場合はNotepadを開きましょう。

・次は、拡張子をHTMLに指定してテキストを保存しましょう

環境によっては.htmlと拡張子を指定しないと行けない場合まありますので注意しましょう。

・その後、保存したファイルを開くと、空のWeb画面が現れます。これからの記事のソースはこのSample.htmlに記入して行きます。

この白い画面の中をあなたのソースで満たせて行きましょう!

HTMLの基本のルール

タグを使う時には以下の様なルールが必要です。

タグは開始タグ終了タグがあり、その中に中身を記述する。

開始タグ終了タグについては前の記事を見てください

例)見出し

<h3>今日の天気</h3>

実行結果

今日の天気

Sample.htmlの実行結果

中身がない場合は以下の様に記述します。「空要素」とも呼びます。

例)改行

これは改行のタグです。<br>覚えておいてください

実行結果

これは改行のタグです。
覚えておいてください

Sample.htmlの実行結果

付属情報は属性として記述します。属性は複数指定することも可能です。

例)リンク属性(下のaタグの場合はhrefが属性となります)

<a href="http://www.dripcoke.com">ホームページに移動します。</a>

実行結果

ホームページに移動します。

Sample.htmlの実行結果

タグは別のタグを含むことはできますが、その際は全体を含まなくてはなりません

例)正しいタグ

<p>今日の天気は<b>快晴</b>です</p>

正しい例の実行結果

今日の天気は快晴です

例)誤った例(よく見るとbタグが囲み切れる前にpタグが来てしまいましたね)

<p>今日の天気は<b>快晴</p>です</b>

誤った例の実行結果

今日の天気は快晴

です

*この様なミスは初心者だけではなく、プロの人にも現れるミスですよく覚えておいてください。

Web開発-初めてのHTML

プログラミングメイン