HTML入門トレーニング

body要素

全333コースを10日間無料で

ぜひご覧ください。

無料で視聴する すべての加入プランを見る
または
実際にブラウザに表示するコンテンツを定義するための、body要素について学びます。
講師:
05:55

字幕

このレッスンではHTMLの中でも 実際にブライザーに表示するコンテンツを 定義する為の 要素について学びます 現在コードエディターで サンプルコードを開いているところです 早速タグを追加しましょう タグはタグには ネスト(入れ子)にされません タグとは兄弟 つまり同等のレベルに当たります その為タグを追加する位置は このタグの 終了タグの後になります それではタグを追加しましょう 山形括弧で という文字列を括ります 終了タグはコードエディターによって 自動的に入力されました 終了タグには頭にスラッシュがあります これでタグを作る事が出来ました タグの中のコンテンツは実際に ブラウザーに表示されます ここではテキストを書いてみましょう 日本語で と入力します するとこの部分は タグに挟まれていますので 実際にブラウザーに表示される という事になります 一度保存しブラウザーで表示してみましょう ブラウザーで先ほどのHTMLを表示しました 実際に先ほど入力したテキスト "ページのコンテンツ" という文字列が 表示されています この時この文字列は デフォルトの状態で表示されています 特に文字の大きさや色等が フォーマットされている訳ではありません 実際このHTMLの中で文字のスタイリング フォーマットをする為には スタイルシートを使います 現在はスタイルシートを 特に使っていませんので デフォルトのレンダリング状態に なっているという事です 実際にデフォルトのレンダリングで 表示されているという事を確認する為に クロームのデベロッパーツールを使いましょう 右クリックから '要素を検証' をクリックして HTMLの要素を確認する為の ツールを開きます するとこの画面下側の 要素の中には 特にCSSやHTMLのタグが 定義されている訳ではない という事が分かります タグの中に直接この "ページのコンテンツ" という文字列が入っていますね それではこのデフォルトのレンダリング を変更してみましょう コードエディターに戻ります 今入力したこの "ページのコンテンツ" という文字列を 見出しとして定義してみましょう 見出しを定義するには 様々な見出しのレベルを決定する必要があります ここでは一番上のレベル レベル1の見出しを定義する為 というタグを使いましょう タグを入力します 山形括弧で という文字列を括ります 開始タグと終了タグの間に そのタグで定義する為のコンテンツを 入れる必要がありますので ここではこの "ページのコンテンツ" という文字列を このの開始タグと終了タグの間に 入力します これで保存してブラウザーで 再度確認してみましょう 編集したHTMLをブラウザーで表示しました 先程とは違って "ページのコンテンツ"という文字列が 大きく表示されている事が分かると思います これはCSSを使った訳ではなく この"ページのコンテンツ"という文字列が 見出しであるという定義をHTMLで行った為 ブラウザーがこの見出しについてのスタイル CSSをデフォルトで 大きくしているという事です この他にも要素の中に 様々なコンテンツを入力してみましょう コードエディターに戻ります 先程追加した見出しの下に 予めコピーしてある長い文章を貼り付けます この文章はこの見出しに対する説明文章です 通常の段落を示す タグで括ってみましょう タグを入力しこのコンテンツは タグの中に 配置される様にします もう一度ブラウザーで確認してみましょう この様に見出しの下に 通常の段落が追加されました 更に要素の中身を 編集していきます コードエディターに戻ります この追加した要素の中に 新しいタグを追加します ここでは文章の中で 他と区別したいテキストを表す タグを使います タグはこの様に記述します ここではこの 'body' という文字も タグで括りたい為 タグの中に 'body' という文字を含める様にします もう一度ブラウザーでプレヴューしてみましょう ブラウザーに切り替えました 'body' というテキストの部分が タグで定義されていますので ここでは少し 太く表示されている事が分かります この様に要素の中にコンテンツを 定義していく事でブラウザーに実際に 表示されるコンテンツを作る事が出来ます このレッスンではHTMLの中でも 実際にブラウザーに表示する コンテンツを定義する為の 要素について学びました

HTML入門トレーニング

HTMLはWebページを作るうえでもっとも重要な言語です。これがきちんと定義されなければ、Webページは正しく表示されません。このコースではHTMLの成り立ちから基本的な構文の書き方、さまざまなタグの意味やその使い方まで幅広い内容を学ぶことができます。またHTMLと並んで重要な言語であるCSSやJavaScriptについても、それぞれその概要を説明します。

5時間43分 (48 ビデオ)
現在、カスタマーレビューはありません…
 
ソフトウェア・トピック
価格: 3,990
発売日:2015年05月01日

このコースは、「オンデマンド」でご利用可能であり、ダウンロードすることもオンラインで見ることもできます。

ダウンロードすると、オフラインでコースを使用し、豊富なインターフェースをフルに活用できます。複数のデバイスを使用したり、 一度に全コースをダウンロードしたくない場合は、アカントにログインして、ストリーミング・ビデオとしてコースのレッスンを視聴してください。

ビデオトレーニングをお楽しみいただけますように! お問い合わせは、cs-jp@lynda.com宛までご連絡ください。