CSSの用語一覧(29語)

CSSに関する用語を解説。プロパティ・セレクタ・Flexbox・Grid・アニメーションなど、Webページの見た目を整えるための用語集。

CSS absolute・relative の違い (アブソリュート・レラティブ のちがい)

relativeは元の位置を基準にずらす配置。absoluteは親要素を基準に自由に配置する。…

CSS animation (アニメーション)

CSSだけで要素を動かすプロパティで、@keyframes と組み合わせて使うよ。いつ使う? ローディングスピナーを回し…

CSS aspect-ratio (アスペクトレシオ)

要素の縦横比を指定するプロパティで、aspect-ratio: 16/9; で動画のような比率になるよ。いつ使う? 動画…

CSS CSS (シーエスエス)

Cascading Style Sheets の略で、HTMLで作った構造に色・大きさ・配置などの見た目を付ける言語だよ…

CSS CSS Grid (シーエスエスグリッド)

行と列の2次元レイアウトを作るCSS機能で、複雑なページレイアウトを直感的に組めるよ。いつ使う? カード一覧を3列に並べ…

CSS display: inline・display: block の違い (ディスプレイインライン・ディスプレイブロック のちがい)

display: blockは前後で改行され幅・高さを指定できる。display: inlineは改行されず幅・高さを指…

CSS Flexbox (フレックスボックス)

要素を横並び・縦並びにするレイアウト方法で、親要素に display: flex を指定するよ。いつ使う? ナビゲーショ…

CSS Grid (グリッド)

行と列で要素を配置するレイアウト方法で、Flexboxより複雑なレイアウトに向くよ。いつ使う? カードの一覧表示、写真ギ…

CSS ID (アイディー)

ページ内で1つだけの名前をつける属性で、CSSでは #id名 で指定するよ。いつ使う? ページ内リンクのアンカー(#se…

CSS margin (マージン)

要素の外側の余白で、隣の要素との距離を調整するよ。いつ使う? カードとカードの間隔を空けたい、セクション間に余白を作りた…

CSS margin・padding の違い (マージン・パディング のちがい)

marginは要素の「外側」の余白、paddingは要素の「内側」の余白。ボックスモデルの基本。…

CSS opacity (オパシティ)

要素の透明度を指定するプロパティで、0(完全に透明)〜1(不透明)の値を取るよ。いつ使う? 要素をフェードイン・フェード…

CSS overflow (オーバーフロー)

要素からはみ出した内容の表示方法を指定するプロパティで、hidden, scroll, auto などがあるよ。いつ使う…

CSS padding (パディング)

要素の内側の余白で、content と border の間の距離だよ。いつ使う? ボタンの文字と枠線の間に余白を作りたい…

CSS position (ポジション)

要素の配置方法を指定するプロパティで、static, relative, absolute, fixed, sticky…

CSS px・em・rem の違い (ピクセル・エム・レム のちがい)

pxは固定サイズ、emは親要素の文字サイズ基準、remはルート要素の文字サイズ基準の単位。…

CSS transform (トランスフォーム)

要素を移動・回転・拡大縮小するプロパティで、translate, rotate, scale などを指定するよ。いつ使う…

CSS z-index (ゼットインデックス)

要素の重なり順を指定するプロパティで、数値が大きいほど手前に表示されるよ。positionが必要。いつ使う? モーダル(…

CSS カスケード (カスケード)

CSSの「C」で、複数のスタイルが競合したとき優先順位に従って適用される仕組みだよ。いつ使う? 意識しなくても常に働いて…

CSS カスタムプロパティ (カスタムプロパティ)

CSS変数のことで、--変数名: 値; で定義し、var(--変数名) で使うよ。色やサイズの一括管理に便利。いつ使う?…

CSS クラス (クラス)

複数の要素に同じ名前をつけられる属性で、CSSでは .クラス名 で指定するよ。いつ使う? 同じスタイルを複数の要素に当て…

CSS セレクタ (セレクタ)

CSSでスタイルを当てる対象を指定する部分だよ。タグ名・.クラス名・#id名 で書くよ。いつ使う? CSSを書くときは必…

CSS プロパティ (プロパティ)

CSSで変更する項目の名前だよ。例:color, font-size, margin。いつ使う? 文字の色を変えたい→c…

CSS ボックスモデル (ボックスモデル)

HTML要素を content → padding → border → margin の4層の箱として扱う考え方だよ。…

CSS メディアクエリ (メディアクエリ)

@media を使って画面幅に応じてCSSを切り替える仕組みだよ。いつ使う? 「スマホでは1列、PCでは3列にしたい」な…

CSS レスポンシブ (レスポンシブ)

画面の大きさに合わせてレイアウトを自動調整するデザイン手法だよ。いつ使う? スマホ・タブレット・PCなど、いろんな画面サ…

CSS (あたい)

プロパティに設定する具体的な内容だよ。例:red, 16px, center。いつ使う? color: red; の「r…

CSS 疑似クラス (ぎじクラス)

要素の状態に応じてスタイルを変える仕組みだよ。例::hover(マウスを乗せたとき)。いつ使う? ボタンにマウスを乗せた…

CSS 詳細度 (しょうさいど)

セレクタの優先順位を決める仕組みで、id > class > タグ名 の順に強いよ。いつ使う? 「CSSを書いたのに効か…

他のカテゴリ

パソコンIT基礎HTMLJavaScriptWebGit開発ツール

← 用語集一覧に戻る