前回はHTML要素を指定してCSSでデザインする方法を学びました。
今回からはついにWEBページを作る流れに入っていきます。
上記のような「具体的なコードの意味を知りたい」という要望に答えていきます。
まず今回は「headタグ内のコードの意味」について解説していきますね。
-
【完全無料】HTMLとCSSの学習ステップ一覧
てんし君こちらはプログラミング初心者の方向けのHTMLとCSSの基本的な学習用ページです。 ここで紹介している学習カリキュラムをやりきれば、最終的にこちらのようなWebサイトを作成可能です。 ...
続きを見る
ではさっそく見ていきましょう。
HTMLのhead要素の解説
今回解説するコードは以下の記事で使ったものと同じです。
-
HTMLとCSSとWEBページの関係性【理解できます】
あなたHTMLとCSSとWEBページってどんな関係性なんでしょうか？ HTMLとCSSの勉強を始めるとHTMLとCSSを使ってWEBページをつくることができるというような言葉をよく見ますよね。 ...
続きを見る
※まだHTMLファイルのコードを持っていない方は、この記事内にコードを載せているので用意してください。
今回はそのHTMLファイルのhead部分を解説します。
head部分の意味を解説
以下はコードの1部です。
この<head>から</head>に囲まれているのがhead要素です。
index.html<head> <title>テストサイト</title> <metacharset="utf-8"> <linkhref="css /style.css"rel="stylesheet" type="text/css" media="all"> </head>
こちらがタイトル部分になります。
index.html<title>テストサイト</title>
こちらがメタタグです。終了タグは有りません。
index.html<metacharset="utf-8">
ちなみにタグの意味についてはHTMLで表示するための決り文句のタグの意味を理解しようを参考に学習をどうぞ。
そして最後。
以下の部分ではcssを読み込んでいます。
もうあなたならすぐにわかりますよね？
index.html<linkhref="css /style.css"rel="stylesheet" type="text/css" media="all">
以上でheadタグ内の記述の説明は終わりです。
次回はいよいよHTMLのメイン部分であるbodyの中身を解説していきます。
>>次の回：HTMLのbody要素とは？【メイン部分を実装していこう】
今回はここまでです。
ありがとうございました。
\ HTMLとCSSについて最初から学びたい方はこちら /
-
【完全無料】HTMLとCSSの学習ステップ一覧
てんし君こちらはプログラミング初心者の方向けのHTMLとCSSの基本的な学習用ページです。 ここで紹介している学習カリキュラムをやりきれば、最終的にこちらのようなWebサイトを作成可能です。 ...
続きを見る
\ Web制作の副業で今すぐ稼ぎたい方はこちら /
-
【無料あり】WEB制作を学べるオンラインスクールランキング【副業で稼ぎたい方向け】
あなたWeb制作の副業で稼ぎたいけど、どのスクールで学ぶのが良いの？ スクール選びで失敗はしたくないです。 ↑このような疑問や不安を解決するべく、現役のWebエンジニアがWEB制作を学べるスク ...
続きを見る
