記錄 CSS
可以修飾的樣式有那幾種:
1. 字體
font-size:10px;font-size:3cm;
color:red;
2. 背景
background-color:#FF00FF;
background-image:url(images/aaa.gif);
background:red url(images/aaa.gif) no-repeat 3px 5px;
3. 邊框
border-style:solid;
border-style-left:
border-style-right:
top
bottom
border-width:10px;
border-color:red;
4. 文本
border-width:10px 20px 30px 40px;
border-color:red green blue yellow;
border:red solid 1px;
語法:
屬性和值 使用 ":"
多個屬性之前使用 ";"
HTMl和CSS結合
1. 內聯式樣式表 <tag style="" />
2. 嵌入式樣式表 <style> </style> 使用這個嵌入到html中
3. 外部樣式表s
樣式選擇器
1. html 樣式選擇器
2. class樣式選擇器
a. tag.classname { }
b. .classname { }
3. id 樣式選擇器
注意: 一個頁面中ID的名不能重複
#idname {}
4. 組合樣式選擇器
選擇器,選擇器,..., ... { }
5. 關聯樣式選擇器
選擇器 選擇器 ... {}
6. 僞樣式選擇器
是在同一個標記中, 不同的狀態時顯示不同的樣式
只對兩個有用: <a>
1. 字體
font-size:10px;font-size:3cm;
color:red;
2. 背景
background-color:#FF00FF;
background-image:url(images/aaa.gif);
background:red url(images/aaa.gif) no-repeat 3px 5px;
3. 邊框
border-style:solid;
border-style-left:
border-style-right:
top
bottom
border-width:10px;
border-color:red;
4. 文本
border-width:10px 20px 30px 40px;
border-color:red green blue yellow;
border:red solid 1px;
語法:
屬性和值 使用 ":"
多個屬性之前使用 ";"
HTMl和CSS結合
1. 內聯式樣式表 <tag style="" />
2. 嵌入式樣式表 <style> </style> 使用這個嵌入到html中
3. 外部樣式表s
樣式選擇器
1. html 樣式選擇器
2. class樣式選擇器
a. tag.classname { }
b. .classname { }
3. id 樣式選擇器
注意: 一個頁面中ID的名不能重複
#idname {}
4. 組合樣式選擇器
選擇器,選擇器,..., ... { }
5. 關聯樣式選擇器
選擇器 選擇器 ... {}
6. 僞樣式選擇器
是在同一個標記中, 不同的狀態時顯示不同的樣式
只對兩個有用: <a>
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.