ページを構成する基本要素
3つのルート要素と、それぞれに何を配置するのかを学びます。
「ページを構成する基本要素」はCoddyKit上の無料HTML Academyレッスンです。 これはレッスン3/3です。 下記で完全なレッスンを無料で読むことができます。その後、ブラウザ内の組み込みコードエディタと24時間対応のAIチューターでハンズオン演習できます。 これはHTML Academy学習パスの一部であり、ウェブとCoddyKitアプリ全体で進捗が同期されます。 HTML Academyコースには全3レッスンが含まれています。
ページはいくつもの部品でできています
すべてのWebページは、要素と呼ばれる小さな部品で作られています。身近な要素を見ていきましょう。🧱
見出し
見出しは、大きく太字で表示されるタイトルです。読者に、そのセクションの内容を伝えます。
<h1>My First Page</h1>段落
段落には通常のテキストを入れます。ページ上の文章のほとんどは、段落の中にあります。
<p>Welcome to my page.</p>画像
画像がページに生き生きとした印象を与えます。小さなタグ1つで、ページ上に画像を配置できます。🖼️
リンク
リンクはページ同士をつなぎます。リンクがあるからこそ、Webをクリックして次々に移動できます。
リスト
箇条書きが必要ですか?リストを使うと、項目を上下にきれいに並べられます。
箱の中に箱を入れる
要素は、箱の中に箱を入れるように、ほかの要素の中に配置できます。これをネストと呼びます。
れんがを積むように作ります
見出し、段落、画像、リンクを組み合わせれば、実際のページが完成します!🏗️
シンプルなレシピ
ほとんどのページは同じようなシンプルなパターンに従います。そのため、いくつかの部品を覚えれば、どんなものでも作れるようになります。
できました!
入門編を終え、基本的な構成要素がわかりました!ここからは、さらに楽しくなります。🎉
クイックチェック
いくつかの構成要素を学びました。通常の本文テキストを入れるのはどれでしょうか。
よくある質問
「ページを構成する基本要素」レッスンは無料ですか?
はい。「ページを構成する基本要素」の完全なテキストはこのウェブで無料で読めます。インタラクティブに演習し(組み込みコードエディタと24時間対応のAIチューター)、HTML Academyコースの残りをアンロックするには、CoddyKit PROにアップグレードしてください。 HTML Academyコースには全3レッスンが含まれています。
「ページを構成する基本要素」で何を学びますか?
3つのルート要素と、それぞれに何を配置するのかを学びます。 ブラウザで直接実行するハンズオンコードでHTML Academyを演習し、24時間対応のAIチューターがレッスンを進める中での質問に答えます。
HTML Academyを始めるのに経験は必要ですか?
事前経験は必要ありません。CoddyKitのHTML Academyは初級者から上級者向けに構成されているため、ここから始めるか最初から始めて、自分のペースで進むことができます。 これはレッスン3/3です。
「ページを構成する基本要素」レッスンにはどのくらい時間がかかりますか?
ほとんどのCoddyKitレッスンは約5~10分かかります。各レッスンはコンパクトでインタラクティブなので、着実に進歩し、ウェブとアプリ全体で正確に前回の場所から再開できます。
このHTML Academyレッスンでコードを書いて実行できますか?
はい。すべてのHTML Academyレッスンに組み込みコードエディタが含まれているため、ブラウザでリアルコードを書いて実行し、即座のAIフィードバックを取得できます。ローカル設定は不要です。
このコースのすべてのレッスン
- HTMLとは
- ブラウザーによるHTMLの読み取り方
- ページを構成する基本要素