WEBページを作ってみよう

WEBページを作ってみよう

準備するもの

  1. テキストエディタ
    Visual Studio Code
  2. ブラウザ
  3. 拡張子の表示

HTMLとCSSに触れてみよう

  1. 新規HTMLファイルの作成
    エディタで新規ファイルを作成し、【index.html】で保存する。
    ファイル名は必ず【全て半角英数字】でつけること。

  2. 最低限必要なHTMLの骨組みを書いてみる。

    <html>
    <head>
    <body>
    </body>
    </head>
    </html>

    HTMLは原則として【開始タグ】と【終了タグ (/)】がセットになっています。

  3. ページにタイトルとコンテンツを記述する

    <html>
    <head>
    <title>HTMLの練習</title>
    </head>
    <body>
    初めてのHTML
    これからWEBページをつくっていきます。
    </body>
    </html>

    入力したら保存してindex.htmlをブラウザで開いてみましょう。
    WEBページを作ってみよう_001

  4. コンテンツを装飾してみる

    <html>
    <head>
    <title>HTMLの練習</title>
    </head>
    <body>
    <h1>初めてのHTML</h1>
    <p>これからWEBページをつくっていきます。</p>
    </body>
    </html>

    入力したら保存してindex.htmlをブラウザで開いてみましょう。
    WEBページを作ってみよう_002

  1. CSSで装飾してみる

    <head>
    <title>HTMLの練習</title>
    <style type="text/css">
        h1{color:red;}
    </style>
    </head>

    入力したら保存してindex.htmlをブラウザで開いてみましょう。
    WEBページを作ってみよう_003

今回の出来上がりページ


トラブルが発生した場合はすぐにお電話(050-5532-9970)ください。
迅速なトラブル解決だけでなく、パソコン購入アドバイスもしております。

パソコンレスキュー
三鷹市周辺のパソコン修理・トラブル解決ならお任せください!

返信を残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

CAPTCHA