用語集
HTML・CSS入門コースで使われる主要な用語(68語)をまとめています。
- 開始タグ・終了タグ (かいしたぐ・しゅうりょうたぐ)
- HTMLのタグは原則として、開始タグ `<タグ名>` と終了タグ `</タグ名>` のペアで構成される。両者の間に書いた内容が、そのタグの効果を受ける。
- → レッスン2
- 開発者ツール(かいはつしゃつーる)
- ブラウザに標準で備わった、Webページの構造やCSSを確認できるツール。F12キーや右クリックの「検証」から開ける。要素のHTML・CSSを確認したり、ボックスモデルを視覚化したりできる、Web制作の必須ツール。
- → レッスン4
- クラス(くらす)
- HTMLのclass属性。CSSのセレクタで `.クラス名` の形で参照し、特定の要素群に共通のスタイルを当てるときに使う。1要素に複数指定でき、同じクラス名を複数要素に付けられる。
- → レッスン3
- 子孫セレクタ (しそんせれくた)
- セレクタを半角スペースでつないで書くことで、特定の要素の子孫にスタイルを当てる書き方。例:`.card h3` は「.cardの中のすべてのh3」を指す。
- → レッスン4
- セマンティックなタグ (せまんてぃっくなたぐ)
- 意味のあるマークアップを実現するためのHTMLタグ。`<header>`・`<nav>`・`<main>`・`<article>`・`<section>`・`<footer>` などが代表例。
- → レッスン7
- デスクトップファースト(ですくとっぷふぁーすと)
- PC向けのレイアウトを先に作り、`max-width` のメディアクエリでスマートフォン用の調整を加えていくレスポンシブ設計の方針。本コースで採用しているアプローチ。
- → レッスン6
- ブレークポイント(ぶれーくぽいんと)
- レスポンシブデザインで、レイアウトを切り替える画面幅の区切り点。一般的には480px・768px・1024pxなどがよく使われるが、コンテンツに応じて調整する。
- → レッスン6
- ブロック要素 (ぶろっくようそ)
- 横幅いっぱいに広がり、前後で改行されるHTML要素の種類。`<h1>`〜`<h6>`、`<p>`、`<ul>`、`<div>` などが該当する。`width` や `height` の指定が効きやすい。
- → レッスン4
- ボックスモデル(ぼっくすもでる)
- HTMLの各要素を「四角いボックス」として捉え、内側から content・padding・border・margin の4層で構成すると理解する考え方。CSSレイアウトの最重要概念。
- → レッスン4
- モバイルファースト(もばいるふぁーすと)
- スマートフォン向けのレイアウトを先に作り、`min-width` のメディアクエリでデスクトップ用の装飾を加えていくレスポンシブ設計の方針。実務で推奨されることが多い。
- → レッスン6
- レスポンシブデザイン (れすぽんしぶでざいん)
- 1つのHTML・CSSで、デスクトップ・タブレット・スマートフォンなど複数の画面サイズに対応するデザイン手法。現代のWeb制作では基本となる考え方。
- → レッスン6
- align-items
- Flexboxで交差軸(デフォルトでは縦方向)の整列を制御するプロパティ。`stretch`(デフォルト)、`flex-start`、`center`、`flex-end` などの値を取る。
- → レッスン5
- box-sizing
- 要素の `width` と `height` がどこまでの範囲を含むかを切り替えるプロパティ。`border-box` を指定すると、widthがborderを含めた外側の幅を指すようになる。
- → レッスン4
- Grid
- 2次元(行と列)のレイアウトを組むためのCSSのレイアウトシステム。Flexboxが1次元向けなのに対し、Gridはダッシュボードや雑誌レイアウトのような複雑な配置を得意とする。
- → レッスン5
- justify-content
- Flexboxで主軸(デフォルトでは横方向)の整列を制御するプロパティ。`flex-start`(左寄せ)、`center`(中央寄せ)、`space-between`(両端寄せ)などの値を取る。
- → レッスン5
- link要素 (りんくようそ)
- HTMLから外部ファイル(CSSなど)を読み込むためのタグ。`<link rel="stylesheet" href="...">` の形で外部CSSを読み込む。
- → レッスン3
該当する用語が見つかりません。