web制作

HTML CSS基本のおさらい記事

HTMLの書き方

<ul>～</ul>は、囲んだ範囲がリストであることを示します

数字なしのリスト

<ol>
  <li>項目その1</li>
  <li>項目その2</li>
  <li>項目その3</li>
</ol>

数字付きリスト

<ol>
  <li>項目その1</li>
  <li>項目その2</li>
  <li>項目その3</li>
</ol>

HTMLのコメントアウト

<!-- ここにコメントを書き込みます -->

また、メモや一時修正のための使い方のほかに、ブロックの区切りを分かりやすくするためにもコメントを使います。

グループにして整理する

<div>
  <ol>
    <li>項目その1</li>
    <li>項目その2</li>
    <li>項目その3</li>
  </ol>
</div>

グループ化するメリット

  1. HTML全体をブロックに分けて整理できる
  2. まとめてデザインを設定できる
  • HTMLではコードを複数のブロックに分けて管理するのが基本
  • <div>を使うと複数のコードをグループ化できる
  • <div>～</div>で囲まれた範囲にはまとめてCSSを設定できる

タグに属性をつける

<タグ名 属性="属性値">
<p id="taro">山田太郎</p>
  • id属性：様々なHTMLタグで使われる。要素に好きな「固有名」を付ける
  • class属性：様々なHTMLタグで使われる。要素に好きな「分類名」を付ける
  • src属性：imgタグ（画像を表示するタグ）で使われる。画像ファイルの置き場所を示す
  • href属性：aタグ（ハイパーリンク）で使われる。リンク先を示す

-web制作