HTMLチュートリアル

HTMLホーム HTMLの紹介 HTMLエディター HTMLベーシック HTML要素 HTML属性 HTML見出し HTML段落 HTMLスタイル HTMLフォーマット HTMLの引用 HTMLコメント HTMLの色 HTML CSS HTMLリンク HTML画像 HTMLファビコン HTMLテーブル HTMLリスト HTMLブロックとインライン HTMLクラス HTMLID HTMLIframe HTML JavaScript HTMLファイルパス HTMLヘッド HTMLレイアウト HTMLレスポンシブ HTMLコンピューターコード HTMLセマンティクス HTMLスタイルガイド HTMLエンティティ HTMLシンボル HTML絵文字 HTML文字セット HTMLURLエンコード HTMLとXHTML

HTMLフォーム

HTMLフォーム HTMLフォーム属性 HTMLフォーム要素 HTML入力タイプ HTML入力属性 HTML入力フォームの属性

HTMLグラフィックス

HTMLキャンバス HTML SVG

HTMLメディア

HTMLメディア HTMLビデオ HTMLオーディオ HTMLプラグイン HTML YouTube

HTML API

HTMLジオロケーション HTMLドラッグアンドドロップ HTMLWebストレージ HTMLWebワーカー HTML SSE

HTMLの

HTMLの例 HTMLクイズ HTML演習 HTML証明書 HTMLの概要 HTMLアクセシビリティ

HTMLリファレンス

HTMLタグリスト HTML属性 HTMLグローバル属性 HTMLブラウザのサポート HTMLイベント HTMLの色 HTMLキャンバス HTMLオーディオ/ビデオ HTMLDoctypes HTML文字セット HTMLURLエンコード HTML言語コード HTTPメッセージ HTTPメソッド PXからEMへのコンバーター キーボードショートカット

HTMLエディター


HTMLを学ぶために必要なのは、シンプルなテキストエディタだけです。


メモ帳またはテキストエディットを使用してHTMLを学ぶ

Webページは、プロのHTMLエディターを使用して作成および変更できます。

ただし、HTMLを学習するには、メモ帳(PC)やテキストエディット(Mac)などの単純なテキストエディターをお勧めします。

シンプルなテキストエディタを使用することは、HTMLを学ぶための良い方法であると私たちは信じています。

以下の手順に従って、メモ帳またはテキストエディットで最初のWebページを作成します。


ステップ1:メモ帳(PC)を開く

Windows 8以降:

スタート画面(画面の左下にあるウィンドウ記号)を開きますメモと入力します。

Windows 7以前:

[スタート] > [ プログラム]> [ アクセサリ ]> [メモ帳]を開きます


ステップ1:テキストエディットを開く(Mac)

Finder>アプリケーション>テキストエディットを開きます

また、いくつかの設定を変更して、アプリケーションがファイルを正しく保存できるようにします。 [設定]> [フォーマット]> [ プレーンテキスト]を選択します

次に、[開いて保存]で、[HTMLファイルをフォーマットされたテキストではなくHTMLコードとして表示する]チェックボックスをオンにします。

次に、新しいドキュメントを開いてコードを配置します。


ステップ2:HTMLを書く

次のHTMLコードをメモ帳に書き込むかコピーします。

<!DOCTYPE html>
<html>
<body>

<h1>My First Heading</h1>

<p>My first paragraph.</p>

</body>
</html>

メモ帳



ステップ3:HTMLページを保存する

ファイルをコンピューターに保存します。メモ帳メニューで[ファイル]> [名前を付けて保存]を選択します。

ファイルに「index.htm」という名前を付け、エンコーディングを UTF-8(HTMLファイルの推奨エンコーディング)に設定します。

ブラウザで表示

ヒント:ファイル拡張子として.htmまたは.htmlのいずれかを使用できます。違いはありません、それはあなた次第です。


ステップ4:ブラウザでHTMLページを表示する

保存したHTMLファイルをお気に入りのブラウザで開きます(ファイルをダブルクリックするか、右クリックして[プログラムから開く]を選択します)。

結果は次のようになります。

ブラウザで表示


W3Schools OnlineEditor-「自分で試してみてください」

無料のオンラインエディタを使用すると、HTMLコードを編集して、ブラウザで結果を表示できます。

コードを高速にテストしたい場合に最適なツールです。また、色分けと、コードを保存して他のユーザーと共有する機能もあります。

<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>

<h1>This is a Heading</h1>
<p>This is a paragraph.</p>

</body>
</html>

[自分で試す]ボタンをクリックして、どのように機能するかを確認してください。


W3Schoolsスペース

独自のWebサイトを作成してコードをオンラインで保存したい場合は 、 W3schoolsSpacesと呼ばれる無料のWebサイトビルダーを試してください。