CSS基礎

名稱

Cascading Style Sheet 級聯樣式表

---

元素

• 塊元素

1,獨立一行
2,可以定義寬高
3,常用元素快 div p ul li

• 內聯元素

1,一行排列顯示
2,不能定義寬高
3,常用元素 span a label

---

語法

選擇器 {
    聲明1;
    聲明2;
    }

---

位置

1、應寫在標籤之間；
2、加上 type=”text/css” 屬性

---

選擇器

1. 標籤選擇器
2. id選擇器
3. 類選擇器

 #id { font-size:16px;}
 <標籤名 id= "id名稱">標籤內容</標籤名>

複合選擇器

1,並集選擇器

p,#id,.class{
    font:red;
    font-size:28px;
}

2, 交集選擇器

    h3.second{
        font-size : 14px;
        color :  green;
        }

選擇器中間不能有空格

3,後代選擇器

p a{
font-size:14;
color:green;
}

---

引用樣式

• 內部樣式
• 行內樣式

<p  style="font-size:14px;  color:green; " >直接在HTML標籤中設置的樣式</p>

• 外部樣式

鏈接式

<link type="text/css" rel="styleSheet" href="文件路徑"/>

導入式

<style type="text/css">
@importurl("css文件路徑")
</style>

---

小圖標放置

background-image:url("images/arrow-down.gif");
background-repeat:no-repeat;
background-position:right center;
background:url(images/arrow-right.gif) right center no-repeat;

---

常用樣式

字體屬性

---

文本屬性

---

背景樣式

---

列表屬性

---

鏈接屬性

---

鼠標屬性

---