1.1基礎概念
css指層疊樣式表（Cascading Style Sheets）
爲什麼需要用CSS
HTML描述了要呈現的內容，而CSS定義了這些內容的呈現形式，比如字體，顏色等，使用CSS能夠將頁面的內容和呈現的形式有效分離，有利於分工合作，也有利於快速更換不同的呈現形式。
使用樣式表可以有三種方式：
（1）內聯方式
<p style="font-size:24px;color: green">內聯樣式的演示</p>
將樣式定義在style屬性中，內容和呈現形式高度耦合，維護困難，不利於分工合作
只能在當前標籤使用
（2）內部樣式
<style>
p{
font-size:36px;
color: red;
}
</style>
</head>
<body>
<p>內部樣式的演示1</p>
<p>內部樣式的演示2</p>
</body>
在<head>標籤中通過<style>標籤來定義
內容和表現形式的耦合程度降低了，但都還是在html文件中，沒有實現完全分離
定義的樣式只能在本頁面中使用
（3）外部樣式表
首先定義一個樣式表文件（.css）/*
定義了應用於段落的樣式：
字體大小：36
顏色：紅色
*/
p{
font-size:36px;
color:blue;
}
Css中也可以使用註釋，形式爲/*.....*/
然後在需要使用這些樣式的html文件中引入該樣式表文件
<head>
<meta http-equiv="Content-Type"content="text/html;
charset=utf-8"/>
<title></title>
<link rel="stylesheet"type="text/css"href="CSS樣式/E102-01-02.css">
</head>
外部樣式表使得內容和表現形式徹底分離，有利於分工合作及維護，可在多個html中引用。
推薦儘量使用外部樣式。
1.2 顏色
所有的顏色都可以由紅色（Red）、（Green）、（Blue）三種顏色調配而成，這三種顏色俗稱三原色。
CSS中用8位表示一個顏色，那麼可以表示256種顏色，即二的八次方，所有總共可以表示256*256*256
CSS中有很多種顏色表示形式：
（1）十六進制:
<p style="color:#ff0000">十六進制顏色表示形式</p>
（2）RGB顏色
<p style="color:RGB（255，0，0）">RGB顏色表示形式</p>
（3）RGBA顏色
在RGB顏色基礎上增加了透明度分量，該分量的取值範圍爲0（完全透明）
-1.0（完全不透明）
<p style="color:RGBA(255,0,0,0.2)">RGBA顏色表示形式</p>
（4）HSL：顏色也可以由另外三個分量來表示，即色調、飽和度和明度。
<p style="color:HSL(120,50%,50%)">HSL顏色表示形式</p>
（5）HSLA：在HSL基礎上增加了Alpha
<p style="color:HSLA(120,50%,50%,0.3)">HSLA顏色表示形式</p>
（6）預定義顏色
<p style="color: blue">預定顏色表示形式</p>
1.3尺寸大小
cm：釐米
mm：毫米
in：英寸（inch）
px：像素（pixel）
%：百分比
em:<em> 標籤告訴瀏覽器把其中的文本表示爲強調的內容。
vw和vb:vh and vw：相對於視口的高度和寬度，而不是父元素的（CSS百分比是相對於包含它的最近的父元素的高度和寬度）。
1vh 等於1/100的視口高度，1vw 等於1/100的視口寬度。
比如：瀏覽器高度900px，寬度爲750px, 1 vh = 900px/100 = 9 px，1vw = 750px/100 = 7.5 px。
px：絕對單位，%相對尺寸單位。
哪些是絕對單位，那些是相對單位？
絕對單位：用基本量(例如長度、時間、質量及電荷或電流)的單位所規定的單位,稱爲絕對單位。這些單位在任何時刻、任何地點都取固定的數值。
相對單位：以基本量作爲參考值，根據這個參考值來使用單位，稱爲絕對單位。
