目錄
1. 內聯樣式
2. 層疊樣式表css
2.1. 類選擇器
2.1.1. 顏色設定
2.1.2. 字型大小設定
2.1.3. css邊框屬性
2.1.4. 設定背景顏色
2.1.5. 設定布局邊框
2.1.6. 樣式的優先級別
2.2. id屬性及選擇器
2.3. 顏色幾種表示方法
2.3.1. 用英文顏色單詞
2.3.2. 用6 位十六進製制數字
2.3.3. 用rgb值
樣式的屬性有很多，其中color用來指定顏色。
以下是為h2元素的文字顏色設定為藍色的
內聯樣式
示例**：
內聯樣式是為元素新增樣式的最簡單有效的方式，但是更易於維護的方式是使用層疊樣式表css（cascading style sheets）。
在**的最頂端，建立乙個如下的style元素：
在這個style元素內, 你可以為所有的h2元素建立乙個
元素選擇器
。比如，如果你想要將所有的h2元素設定為紅色, 你的**應該看起來像這樣：
注意：一定要在屬性值的後面加上分號;。
我們先宣告乙個類選擇器：
上面的**在
如果感覺邊框比較尖，我們可以通過css的乙個叫border-radius(邊框半徑)的屬性來讓它的邊框變成圓的。
你同樣可以使用畫素來指定border-radius的屬性值，如border-radius:10px;。
除了畫素，你還可以使用百分比來指定border-radius邊框半徑的值
，如border-radius:50%;
你可以用 background-color 屬性來設定乙個元素的背景顏色。
例如，如果你想把乙個元素的背景顏色設定為green，你應該把這些加到你的 style 元素中：
.green-background
有三個影響html元素布局的重要屬性：padding(內邊距)、margin(外邊距)、border(邊框)。
2.1.5.1.padding(內邊距
)元素的 padding 控制元素內容 content和元素邊框 border 之間的距離。
有時你想要自定義元素，使它的每乙個邊具有不同的 padding。
css 允許你使用 padding-top、padding-right、padding-bottom 和 padding-left來控制元素上右下左四個方向的 padding。
除了分別指定元素的 padding-top、padding-right、padding-bottom 和 padding-left 屬性外，你還可以集中起來指定它們，舉例如下：
padding: 10px 20px 10px 20px;
這四個值以順時針方式排列：頂部、右側、底部、左側，簡稱：上右下左。
2.1.5.2.margin(外邊距
)元素的外邊距 margin 控制元素邊框 border 和元素實際所佔空間的距離。
如果你將乙個元素的 margin 設定為負值，元素將會變大。
有時你想要自定義元素，使它的每乙個邊具有不同的 margin。
css 允許你使用 margin-top、margin-right、margin-bottom 和 margin-left 來控制元素上右下左四個方向的 margin。
除了分別指定元素的 margin-top、margin-right、margin-bottom 和 margin-left 屬性外，你還可以集中起來指定它們，舉例如下：
margin: 10px 20px 10px 20px;
這四個值以順時針方式排列：頂部、右側、底部、左側，簡稱：上右下左。
瀏覽器讀取 css 的順序是從上到下，這意味著，在發生衝突時，瀏覽器會使用最後的 css 宣告。
id 屬性總是比類屬性
具有更高的優先順序。無論在 style 元素 css 的哪個位置進行宣告，id 宣告都會覆蓋 class 宣告。
行內樣式將覆蓋style 中定義的所有 css。
還有最後一種覆蓋 css 的方法，這是所有方法中最強大的，但是在講它之前，我們先講講為什麼你要覆蓋 css。
很多情況下，你會使用 css 庫，這些庫可能會意外覆蓋掉你自己的 css。所以當你需要確保某元素具有指定的 css 時，你可以使用!important。
舉例如下：
color: pink !important;
除了 class屬性之外，每乙個 html 元素還可以使用 id 屬性。
使用 id 屬性有若干好處，一旦當你開始使用 jquery 的時候你會有更深的體會。
id 屬性應該是唯一的，雖然瀏覽器並不強制唯一，但基於最佳實踐，這一點是被廣泛認可的，所以請不要給乙個以上的元素設定相同的id 屬性。
如：和類選擇器一樣，你也可以使用id選擇器來宣告樣式。
宣告乙個叫cat-photo-element的id選擇器 ，並設定背景色為綠色。：
#cat-photo-element
注意：在你的 style 元素內部，定義類選擇器必須新增 . 為字首，定義id選擇器必須新增 #為字首。
如 color: blue;
在 css 中，我們可以使用 6 位十六進製制數字來表示顏色，每 2 位分別表示紅色 (r)、綠色 (g) 和藍色 (b) 成分。例如， 是黑色，同時也是可能的數值中最小的，如 color: #000000;。
0 是 hex code（十六進製制編碼）中最小的乙個，它代表顏色的完全缺失。
f 是 hex code（十六進製制編碼）中最大的乙個，它代表最大可能的亮度。
hex code 遵循 red-green-blue（紅-綠-藍），或者叫 rgb 格式。hex code 中的前兩位表示顏色中紅色的數量，第三四位代表綠色的數量，第五六位代表藍色的數量。
所以要得到絕對的純紅色，你只需要在第一和第二位使用 f （最大可能的數值），且在第
三、第四、第五和第六位使用 0 （最小可能數值）。
許多人對超過 1600 萬種顏色感覺十分地抓狂，並且 hex code 非常難以記憶。幸運的是，你可以縮短它。
例如，紅，hex code 是 #ff0000 ，可被縮寫成 #f00。也就是說，一位表示紅，一位表示綠，一位表示藍。
這會把所有可能的顏色數減少至大約 4000 種，但是瀏覽器會把 #ff0000 和 #f00 解釋為完全相同的顏色。
在 css 中表示顏色的另乙個方法是使用 rgb值
，如 color: rgb(0, 0, 0);。
代表黑色的 rgb 值看起來是下面的樣子：
rgb(0, 0, 0)
代表白色的 rgb 值看起來是下面的樣子：
rgb(255, 255, 255)
HTML基礎2css樣式表
1.內部樣式 2.外部樣式 3.行內樣式 4.css語法 selector每個css樣式由3個部分組成，選擇器，屬性和值。屬性必須放在 內，屬性和屬性值用冒號連線。1 標籤選擇器 元素名稱 使用結構中的元素名稱作為選擇器。例如body,div,p,img等。2 id選擇器 id名 乙個id名稱只能對...
2 Css中的樣式選擇器
1 樣式規則的選擇器 通過怎樣的途徑來獲得頁面上要設定樣式的元素 1 html selector 2 class selector 需要給要設定樣式的元素的class屬性賦值 3 id selector 需要給要設定樣式的元素的id屬性賦值 4 關聯選擇器 p em text indent 0cm ...
前端基礎 2 CSS
選擇器 注釋用 這裡是注釋 在html標籤中用style屬性值設定 key value1，value2.key value1，value2.我是內容 在html 的head標籤中用style標籤來定義css樣式 要用到選擇器,這裡先用標籤選擇器 把css樣式寫成單獨的css檔案 要用到選擇器 再在h...