一、HTML 元素的樣式定義：
（1）瀏覽器缺省設置
也就是什麼也不指定，就用缺省設置。如：
<text> hello world<text>
（2）外部樣式表
存放在一個特定的CSS文件中，然後在html中引用這個文件。如：
<head>
<link rel="stylesheet" type="text/css" href="index.css" />
</head>
（3）內部樣式表（位於 標籤內部）
<head>
<style type="text/css">
img
{
position:absolute;
bottom:5%
}
</style>
</head>
（4）內聯樣式（在 HTML 元素內部）
<html>
<body>
<p style="color:red; text-indent:5em;"> hello wolrd</p>
</body>
</html>
二、CSS
1、CSS 概述
CSS 是指層疊樣式表，定義如何顯示 HTML 元素，樣式的定義通常存儲在樣式表文件中，獨立於HTML文件。
2、CSS 語法
CSS 樣式定義由兩個主要的部分構成：選擇器以及一條或多條樣式。選擇器就是HTML中元素的標籤或ID或class, 以此來指定該樣式適用於哪個或哪些HTML元素。如下圖所示：
3、顏色值的表示方法
（1）文字表示法：
Black：黑色
Blue：藍色
Pink：粉紅色
Red：紅色
White：白色
Yellow：黃色
Green：綠色
Gray：灰色
Violet：紫色
（2）十六進制表示法：
#RRGGBB：其中的 RR（紅色）、GG（綠色）、BB（藍色）十六進制整數規定了顏色的成分。所有值必須介於 0 與 FF 之間。
如：
灰色:Gray #808080
白色:White #FFFFFF
黑色：Black #000000
（3）RGB 表示法
rgb(red, green, blue)。每個參數 (red、green 以及 blue) 定義顏色的強度，可以是介於 0 與 255 之間的整數，或者是百分比值（從 0% 到 100%）。
p
{
background-color:rgb(255,0,0);
color:rgb(0,0,100%);
}
（4）RGBA 表示法
RGBA 顏色值是 RGB 顏色值的擴展，帶有一個 alpha 通道 - 它規定了對象的不透明度。RGBA 顏色值的規定：rgba(red, green, blue, alpha)。alpha 參數是介於 0.0（完全透明）與 1.0（完全不透明）的數字。
p
{
background-color:rgba(255,0,0,0.5);
}
（5）HSL 表示法
HSL 指的是 hue（色調）、saturation（飽和度）、lightness（亮度） - 表示顏色柱面座標表示法。
HSL 顏色值：hsl(hue, saturation, lightness)。
- Hue
Hue 是色盤上的度數（從 0 到 360） - 0 (或 360) 是紅色，120 是綠色，240 是藍色。
- Saturation
Saturation 是百分比值；0% 意味着灰色，而 100% 是全綵。
- Lightness
Lightness 同樣是百分比值；0% 是黑色，100% 是白色。
p
{
background-color:hsl(120,65%,75%);
}
4、距離或大小（尺寸）的表示單位
| 單位 | 描述 |
|---|---|
| % | 百分比 |
| in | 英寸 |
| cm | 釐米 |
| mm | 毫米 |
| ex | 一個 ex 是一個字體的 x-height。 (x-height 通常是字體尺寸的一半。) |
| pt | 磅 (1 pt 等於 1/72 英寸) |
| pc | 12 點活字 (1 pc 等於 12 點) |
| px | 像素 (計算機屏幕上的一個點) |
| em | 1em 等於當前的字體尺寸。2em 等於當前字體尺寸的兩倍。 |
<html>
<body>
<p style="max-width:40px">文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本
</p>
</body>
</html>