CSS

CSSはスタイリングです。

CSSはWebアプリケーションの外観を担当する.
より良いユーザーエクスペリエンス(UX:User Experience)を得るためには、3つの要素が必要です.
1.適切な場所にコンテンツを配置する(レイアウト)
2.最小のフォントレイアウト(レイアウト、レイアウト)テキストのハイライトなど
3.最も低いアクセス性(ex.色)
以上の3つの要素を適用して、既存のウェブサイトを審美化することができます.

CSS構文の構成

セレクタ(Selector):かっこの前に表示されるタグ名
かっこに属性と値を書いてスタイルを表します.
各プロパティとプロパティの間には、セミコロン(;)で区切らなければなりません.

デフォルトコレクタ(セレクタ)

1.idでスタイルを名前付けて適用

CSSは、#シンボルを使用してidを選択することができる.
ex)navigation sectionの下の<h4>を指定するために、
idでこのユニットに名前を付けて解決することができます.

<h4 id="navigation-title">This is the navigation section.</h4>

# navigation-title {
  color: red;
}

2.スタイルを分類してclassに適用する

idは、ドキュメント内の1つの段落にのみ適用できます.
classは、#ではなく.を使用してclassを選択することができる.

ex) navigation section의 `<li>` 엘리먼트와 footer의 `<li>` 엘리먼트를 구분하고자 하면

<ul>
  <li class="menu-item">Home</li>
  <li class="menu-item">Home</li>
  <li class="menu-item">Home</li>
  <li class="menu-item">Home</li>
</ul>

.menu-item {
  text-decoration: underline;
}

3.複数のclassを1つのエンティティに適用する

classは、1つの別名に複数を適用できます.
クラス名をスペースで区切ります.

ex) "menu-item"이라는 클래스에서 선택되어 있는 메뉴라는 class를 적용하려면

<li class="menu-item selected">Home</li>

.selected {
  font-weight: bold;
  color: #009999;
}

idとclassの違い

id
class
# 選択
. 選択
必要に応じて自由に命名できます
必要に応じて自由に命名できます
ドキュメントに一意の値を持つエンティティは1つしかありません
同じ値を持つ大量のエンティティ
1つの値のみ
エンティティには複数の値があります.
特定のエンティティの名前付けに使用
スタイル分類