CSS first steps

翻譯不完整。 請幫助我們翻譯這篇文章!

CSS (Cascading Style Sheets) is used to style and lay out web pages — for example, to alter the font, color, size, and spacing of your content, split it into multiple columns, or add animations and other decorative features. This module provides a gentle beginning to your path towards CSS mastery with the basics of how it works, what the syntax looks like, and how you can start using it to add styling to HTML.

必備條件

在開始這個單元之前,你應該具備:

  1. 對使用電腦以及被動地使用網路(換句話說:「瀏覽網路」、「了解內容」)有基本的熟悉度。
  2.  一個基本的工作環境(詳見:Installing basic software),以及對如何建立和管理檔案的認知(詳見:Dealing with files)。
  3. 對HTML有基本的認識,此已闡述於Introduction to HTML單元。 

注意: 如果你是使用無法新增自己的檔案的電腦、平板或其他裝置,你可以試著在線上程式設計軟體使用(大多的)程式碼範例,例如:JSBin 或 Glitch

指南

這個單元包含以下會帶你認識所有CSS基本理論,以及提供你機會測試一些技巧的文章:

What is CSS?
CSS (串接樣式表) 讓你能建立好看的網頁,但該如何實踐理論?這篇文章用一個簡單的語法範例解釋什麼是CSS,同時也涵括了一些這個語言的重要術語。
Getting started with CSS
在這個文章中,我們會使用一個簡單的HTML文件,並在其中運用CSS,以及在過程中學習一些關於這個語言的實作。
How CSS is structured
現在你有了CSS是什麼以及使用CSS的基礎概念,是時候去更深入探討這個語言本身的結構了。我們已經遇到了一些在這裡闡述的觀念;如果你對任何之後探討的觀念有疑惑,你可以到這一篇回顧。
How CSS works
我們已經學到了CSS的基礎:它的用途以及如何撰寫簡單的樣式表。在這個課程中,我們會看看瀏覽器如何把CSS和HTML變成網頁。
Using your new knowledge
具備了你先前從過去的幾堂課中學到的知識之後,你應該發現你可以以CSS製作簡單的文字檔,並加入你自己的風格。這個文章給你一個機會去做這件事。

另見

Intermediate Web Literacy 1: Intro to CSS
傑出的Mozilla機構課程探索以及嘗試很多在Introduction to CSS module(CSS介紹單元)提到的技巧。學習?*定型*在網頁、CSS選擇器、標籤屬性和值上的HTML元素。