CSS 簡介

什么是 CSS？

  • CSS 指的是層疊樣式表* (Cascading Style Sheets)
  • CSS 描述了如何在屏幕、紙張或其他媒體上顯示 HTML 元素
  • CSS 節省了大量工作。它可以同時控制多張網頁的布局
  • 外部樣式表存儲在 CSS 文件中

*：也稱級聯樣式表。

CSS 演示 - 一張 HTML 頁面 - 多個樣式！

下面是一張提供了四個不同樣式表的 HTML 頁面。請單擊下面的樣式表鏈接，來查看不同的樣式：

為何使用 CSS？

CSS 用于定義網頁的樣式，包括針對不同設備和屏幕尺寸的設計和布局。

CSS 實例

body {
  background-color: lightblue;
}
h1 {
  color: white;
  text-align: center;
}
p {
  font-family: verdana;
  font-size: 20px;
}

親自試一試

CSS 解決了一個大問題

HTML 從未打算包含用于格式化網頁的標簽！

創建 HTML 的目的是描述網頁的內容，例如：

<h1>這是一個標題。</h1>
<p>這是一個段落。</p>

將 <font> 之類的標簽和 color 屬性添加到 HTML 3.2 規范后，Web 開發人員的噩夢開始了。大型網站的開發將字體和顏色信息添加到每個頁面中，這演變為一個漫長而昂貴的過程。

為了解決這個問題，萬維網聯盟（W3C）創建了 CSS。

CSS 從 HTML 頁面中刪除了樣式格式！

如果您不知道 HTML 是什么，建議您閱讀 HTML 教程。

CSS 節省了大量工作！

樣式定義通常保存在外部 .css 文件中。

通過使用外部樣式表文件，您只需更改一個文件即可更改整個網站的外觀！