はじめに
CSSハンドブックへようこそ！私はJunoです。ウェブのこの部分を教えるのが大好きです。HTMLはページの構造を与え、CSSはそこに命を吹き込みます：色、スペーシング、タイプ、ページ全体の見た目です。
最初のCSSの行から始めて、ゆっくりと、1つのアイデアずつ積み上げていきます。少しHTMLが書ければ、ここにあるすべてのことができます。
質問に基本的すぎることはありません。自分のペースで進んでください。一緒にたどり着きましょう！
このハンドブックは、少しのHTMLが書け、ページを思い通りに見せたい人のためのものです。Cascading Style Sheetsの略であるCSSは、ページがどのように見えるかを説明する言語です：その色、フォント、スペーシング、画面上のすべての配置です。HTMLはページに何があるかを言い、CSSはそれがどのように見えるべきかを言います。このドキュメント全体で見られる2つの用語について簡単に説明します：プロパティはcolorやfont-sizeのようにスタイル設定できる1つのもので、セレクタはスタイル設定したい要素にCSSを向ける方法です。ここのすべてのコンセプトは、完全に、深く、例と、すばやく答える必要があるときにいつでも検索できるものとして書き出されています。
デザインの背景は必要ありません。ページに見出しと段落を配置できれば、始めるには十分であり、他のすべては出現するときに導入されます。CSSはほぼすべてのウェブ開発者が学ぶ2番目の言語であり、HTMLの直後です。なぜなら、スタイルなしのページは何もスタイルなしのテキストに過ぎないからです。
ハンドブックは下から上へと進みます。ページにスタイルを付ける方法と正しい要素をターゲットにする方法、ボックスモデルがスペーシングとサイズをどのように制御するか、色とタイプの操作方法、そしてフレックスボックスとグリッドでページをレイアウトしたり、任意のスクリーンに対応させる方法を学びます。個々のアイデアは単独では小さいですが、実際に公開できるインターフェースに積み重ねられます。
ここでのアプローチは、各CSSの部分が何をするのか、そしてなぜするのかを説明することです。何をタイプするのかだけではなく。誰でも例からプロパティを貼り付けて、画面上で何かが移動するのを見ることができます。それと、重複するスタイルが複数のスクリーンで適応し、読みやすく、変更が安いレイアウトを作成することの間の距離は、ブラウザがあなたのスタイルの意味を重複する場合にどのように決定するかを理解することです。その理解は、どの単一プロジェクトよりも長く持続するものです。
ガイドに会いましょう
このハンドブックは3つのガイドでホストされており、あなたが誰があなたを案内するかを選びます。教材はすべての人に同じです。あなたのガイドはそれが語られる声を設定し、適応するページでは、各セクションの深さを設定します。
- Junoは初心者向けトラックを教えます：温かく忍耐強く、平易な類似表現、何も想定されません。
- Aceは中級トラックを教えます：実用的でビルドファースト、あなたが実際にすることに真っすぐに。
- Solは深掘り：メカニズム、トレードオフ、そして他の誰もがスキップするプロダクション詳細を教えます。
ガイドはいつでも任意のページの上部のピッカーから切り替えるか、右下のPreferencesを開いてガイド、言語、またはフォントサイズを変更してください。
セットアップができたら、ハンドブックは本格的に始まります。次のチャプターのWhat is CSSは、CSSが実は何であるか、HTMLと共にどのようにペアリングされるか、そして全体のトラックが構築されている規則、セレクタ、プロパティの小さな語彙をカバーしています。
構築することで学びたいですか？Scrimbaの無料HTMLおよびCSSコースは、5つのプロジェクトと75以上のインタラクティブなチャレンジを通じて同じ内容をカバーしています。