【原】《DIV+CSS商業案例與網頁布局開發精講》讀書筆記(2)

來源:互聯網
上載者:User

1.CSS基本文法:包括3個方面,選取器、屬性、屬性值。

選取器 { 屬性 : 屬性值; }

注意:

1)屬性必須包含在{}中。

2)屬性和屬性值之間用:分隔。

3)多個屬性時,用;進行區分。

4)書寫屬性時,屬性之間使用空格、換行等不影響屬性的顯示。

5)一個屬性有多個屬性值,每個屬性值之間用空格分隔開。

2.CSS的調用方式:

包括3種,行間調用(元素中直接定義樣式)、內部調用(頁面中定義樣式)和外部調用(單獨寫樣式檔案被調用)。

3.行間調用:

<元素名稱 style="屬性:屬性值"></元素名稱>

4.內部調用:

<style>

選取器 { 屬性 : 屬性值; }

</style>

調用時,根據不同的內容,寫法不同。

1)<元素名稱 class="類別選取器名稱"></元素名稱>

2)<元素名稱 id="id選取器名稱"></元素名稱>

5.外部調用:

1)使用link元素調用

<link rel="stylesheet" href="css檔案路徑" type="text/css">

2)使用@improt調用

<style type="text/css">@import url(css檔案路徑)</style>

6.應用CSS的優先順序:

行間調用優先順序最高、內部調用次之、外部調用最低。

 1 <html>
 2     <head>
 3         <style>
 4         div {
 5             color:red;
 6             background:green;
 7         }
 8 
 9         span {
10             color:red;
11             background:green;
12         }
13         </style>
14     </head>
15     <body>
16         <div style="background:red;color:green;">CSS優先順序</div>
17         <span>CSS優先順序</span>
18     </body>
19 </html>

7.DOCTYPE:Document Type(文件類型)的縮寫。用以制定頁面所使用的XHTML或HTML的版本。

8.DOCTYPE的選擇:

在XHTML1.0中有3種DTD(文件類型定義),分別為過渡的(Transitional)、嚴格的(Strict)和架構的(Frameset)。

1)過渡的DTD

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 

2)嚴格的DTD

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 

3)架構的DTD

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd"> 
相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.