はじめに
HTMLやCSS、JavaScriptを勉強中のため、覚え書きとして簡単にまとめていこうと思います。
Body
bodyタグの中に含めたコンテンツがWebページ上に表示されます。
<body>
<p> Hello World! </p>
</body>Headings
見出しは<h1>のような形で記述します。1, 2, 3 と数字に応じて見出しの階層を深くします。
<body>
<h1>The Brown Bear</h1>
<h2>About Brown Bears</h2>
<h3>Species</h3>
<h3>Features</h3>
</body>Divs
divタグはHTMLのコンテンツのグルーピングに使用します。CSS等で装飾する際などに使用します。
<body>
<h1>The Brown Bear</h1>
<div>
<h2>About Brown Bears</h2>
<h3>Species</h3>
<h3>Features</h3>
</div>
</body>id
divタグにはidやClassを指定することができます。こちらも、CSS等で使用されます。
<body>
<h1>The Brown Bear</h1>
<div id="introduction">
<h2>About Brown Bears</h2>
<h3>Species</h3>
<h3>Features</h3>
</div>
</body>Displaying text
<p>タグ内に文章を記述します。
<span>タグは、インライン要素として、文章中の一部を指定する際に使用します。
<div>
<h1>Technology</h1>
</div>
<div>
<p><span>Self-driving cars</span> are anticipated to replace up to 2 million jobs over the next two decades.</p>
</div>
Styling text
<em>タグでイタリック体（斜体）に、<strong> タグでBold（太字）にします。
<div id="introduction">
<h2>About Brown Bears</h2>
<p>The brown bear (<em>Ursus arctos</em>) is native to parts of northern Eurasia and North America.
Its conservation status is currently <strong>Least Concern</strong>.
There are many subspecies within the brown bear species, including the Atlas bear and
the Himalayan brown bear.
</p>
</div>Line Breaks
<br>タグで改行を行います。これは開始タグのみです。
<br>Unordered Lists
・によるリスト表記には<ul>タグと、その中に<li>タグを使用します。
<ul>
<li>Arctos
<li>Collarus
<li>Horribilis
<li>Nelsoni (extinct)
</ul>Ordered lists
1, 2, 3と順番をつけるリスト表記の場合は、<ol>タグと、その中に<li>タグを使用します。
<ol>
<li>Russia</li>
<li>United States</li>
<li>Canada</li>
</ol>Image
<img>タグを用いて、src属性でファイルを指定します。alt属性を使用することで、画像の説明を入力できます。
<img src="~~~~~.jpg" alt="a image description" />Video
src属性でファイルを指定します。 control属性を使用することで、ブラウザで再生・停止等ができるようになります。
タグの間のテキストは、動画をロードできなかった場合に表示されます。
<video src="myVideo.mp4" width="320" height="240" controls>
Video not supported
</video>