CSS

Web ページの見た目を定義する言語。レイアウト・色・装飾を担う

Web開発スタイル
CSS」の技術書を見る (47 冊) →

CSS とは

CSS (Cascading Style Sheets) は、Web ページの見た目を定義するための言語だ。HTML が文書の「構造」を表すのに対し、CSS は色・フォント・余白・レイアウトといった「装飾と配置」を担う。構造と見た目を分離することで、同じ HTML に異なるデザインを適用したり、デザインだけを一括変更したりできる。

役割分担

言語 担当
HTML 文書の構造・意味
CSS 見た目・レイアウト
JavaScript 動き・振る舞い

この 3 つが役割を分け合うことで、Web ページは成り立つ。構造と装飾を分けるのは、保守性を高めるための基本原則だ。

進化したレイアウト

かつて CSS でのレイアウトは技巧的で難しかったが、Flexbox や Grid といった仕組みの登場で、複雑な配置を宣言的に記述できるようになった。画面サイズに応じて見た目を変える「レスポンシブデザイン」も、CSS の機能で実現する。古い知識のまま CSS を語ると、現在の効率的な手法とずれる点に注意したい。

学ぶうえでの勘所

CSS は「とりあえず見た目が整う」までは易しいが、大規模になると管理が難しくなる言語だ。スタイルが意図せず他の箇所に影響する、上書き関係が複雑化する、といった問題が起きやすい。命名規則やコンポーネント単位での管理など、破綻を防ぐ設計が重要になる。また、アクセシビリティ (文字の見やすさ、コントラスト) への配慮も、見た目を扱う CSS の責任範囲だ。見た目を整えるだけでなく、誰にとっても使いやすいページを目指したい。

学習には関連書籍が役立つ。

この記事は役に立ちましたか?

関連用語

関連する記事