檢視如下**
some text here.
如果使用html標記中的屬性來定義樣式，各元素對於樣式的屬性定義各不相同
使用css定義樣式
使用css： 各元素使用統一的樣式宣告，且提高了樣式的可重用行和可維護性！
層疊樣式表，又 叫級聯樣式表，簡稱樣式表
• 用於 html 文件中元素的樣式定義
– 實現了將內容與表現分離
– 提高**的可重用性和可維護性
css 與 html 之間的關係
• html 用於構建網頁的結構
• css 用於構建 html 元素的樣式
• html 是頁面的內容組成，css 是頁面的表現
段落2段落3
html 屬性與 css 樣式的使用原則
• w3c 建議盡量使用 css 樣式取代 html 屬性
– 實現內容和表現的分離
– 如果為 html 所特有的屬性，則使用 html 屬性
使用 css 樣式表的方式
• 內聯方式
– 樣式定義在單個的 html元素中
• 內部樣式表
– 樣式定義在 html 頁的頭元素中
• 外部樣式表
– 將樣式定義在乙個外部的 css 檔案中（.css 檔案）
– 由 html 頁面引用樣式表檔案
內聯方式使用 css
• 樣式定義在 html 元素的標準屬性 style 裡
• css 語法
– 只需要將分號隔開的乙個或者多個屬性/值對作為元素的 style 屬性的值
– 屬性和屬性值之間用：連線
– 多對屬性之間用；隔開
內部樣式表
• 樣式表規則位於文件頭元素中的 元素內
– 在文件的
可以在當前頁面範圍內重用
• 在 元素中新增樣式規則
– 可以定義多個樣式規則
– 每個樣式規則有兩個部分：選擇器和樣式宣告
• 選擇器：決定哪些元素使用這些規則
• 樣式宣告：一對大括號，包含乙個或者多個屬性/值對
外部樣式表
• 第一步：建立乙個單獨的樣式表檔案用來儲存樣式規則
– 乙個純文字檔案，檔案字尾為.css
– 該檔案中只能包含樣式規則
– 樣式規則由選擇器和樣式宣告組成
mystyle.css 檔案h1– 在文件的p
段落 其他文字
可以實現內容與表現分離 ，可以被站點中的所有頁面重用
• 內聯樣式：由樣式宣告組成
• 樣式表（內部樣式表或者外部樣式表）
– 由多個樣式規則組成
– 每個樣式規則有兩個部分：選擇器和樣式宣告
選擇器 樣式宣告 |
↓ 屬性 值 … |
h1 |
css 樣式表特徵
1. 繼承性
– 大多數 css 的樣式規則可以被繼承
2. 層疊性
– 可以定義多個樣式
– 不衝突時，多個樣式表中的樣式可層疊為乙個
3. 優先順序
– 樣式定義衝突時，按照不同樣式規則的優先順序來應用樣式
通用選擇器
• 通用選擇器，顯示為乙個星號（*）
– 可以與任何元素匹配
– 常用於設定一些預設樣式，比如設定整個文件的文字的預設字型和大小
font-size : 9pt;
font-family : "times new roman";
元素選擇器
• html 文件的元素就是選擇器
– 比如
群組選擇器
• 選擇器宣告為以逗號隔開的選擇器列表
– 將一些相同的規則作用於多個元素
樣式表中：定義選擇器分組
h2, p.important
color:green;
font-size:20pt;
border:1px solid red;
html 文件中：
p text
偽類選擇器
• 偽類用於向某些選擇器新增特殊的效果
• 使用冒號(:)作為結合符，結合符左邊是其他選擇器，右 邊是偽類
– 選擇器 : 偽類選擇器
• 鏈結偽類
– : link ，適用於尚未訪問的鏈結
– : visited ，適用於訪問過的鏈結
• 動態偽類，用於呈現使用者操作
– :hover，適用於滑鼠懸停在 html 元素時
– :active，適用於 html 元素被啟用時
– :focus，適用於 html 元素獲取焦點時
樣式表中：定義偽類選擇器
a:link
css基本語法
最近 要經常用到css，但是語法 老是忘記，先貼起來！摘自http www.webjx.com 1.css的語法 css的定義是由三個部分構成 選擇符 selector 屬性 properties 和屬性的取值 value 語法 selector 選擇符 說明 選擇符是可以是多種形式，一般是你要定義...
CSS基本語法
1.基本語法 css的定義是由三個部分構成 選擇符 selector 屬性 properties 和屬性的取值 value 基本格式如下 selector 選擇符 選擇符是可以是多種形式，一般是你要定義樣式的html標記，例如body p table 你可以通過此方法定義它的屬性和值，屬性和值要用冒...
CSS基本語法
css 規則由兩個主要的部分構成 選擇器，以及一條或多條宣告 選擇器通常是您需要改變樣式的 html 元素。每條宣告由乙個屬性和乙個值組成。屬性 property 是您希望設定的樣式屬性 style attribute 每個屬性有乙個值。屬性和值被冒號分開。如果你要在html元素中設定css樣式，你...