編輯“CSS”

[[image:Ct_css_boxmodel_example.gif|right]]
'''CSS'''是Cascading Style Sheets的英文縮寫,即層疊樣式表。CSS是一種[[標(biāo)記語言]]，不需要編譯，可以由瀏覽器執(zhí)行。CSS用來控制頁面的顯示樣式。

==CSS介紹==
* CSS是Cascading Style Sheets(層疊樣式表)的簡(jiǎn)稱. 
* CSS語言是一種標(biāo)記語言,它不需要編譯,可以直接由瀏覽器解釋執(zhí)行(屬于瀏覽器解釋型語言).
==CSS簡(jiǎn)介==
[[CSS簡(jiǎn)介]]

== DIV+CSS布局大全 ==
[http://down.zzbaike.com/ebook/divcss-434.html 站長(zhǎng)下載]

=== CSS布局的優(yōu)點(diǎn) ===
用CSS布局相對(duì)于傳統(tǒng)的TABLE網(wǎng)頁布局而具有以下3個(gè)顯著優(yōu)勢(shì)：

1：表現(xiàn)和內(nèi)容相分離

2：提高頁面瀏覽速度

3：易于維護(hù)和改版

==CSS樣式規(guī)則==
CSS的語法很簡(jiǎn)單，它使用一組英語詞來表示不同的樣式和特征。
一個(gè)樣式表有一組規(guī)則組成，每個(gè)規(guī)則提議涂改"選擇器"(sekector)和一個(gè)定義部分組成，每個(gè)定義部分包含一組有半形分號(hào)（;）分離的定義，這組定義放在一對(duì)大括弧({ })直接，每個(gè)定義有一個(gè)特性，一個(gè)半形冒號(hào)（:）和一個(gè)值組成
'''選擇器(Selector)''':通常為文件中的元素(element),如[[HTML]]中的<code>&lt;BODY&gt;，&lt;P&gt;，&lt;strong&gt;</code>等標(biāo)簽，多個(gè)選擇器可以半形逗號(hào)（,）隔開。
'''屬性(property)'''：CSS1、CSS2、CSS3規(guī)定了許多的熟悉，目的在控制選擇器的樣式。

'''值(Value)'''：指屬性接受的設(shè)定值，可由各種[[關(guān)鍵詞]]組成，多個(gè)關(guān)鍵詞大都已空格隔開。

'''要針對(duì)沒有標(biāo)簽定義范圍進(jìn)行樣式設(shè)定時(shí)，可利用code>&lt;div&gt;</code>與<code>&lt;span&gt;</code>標(biāo)簽'''

例子：
<source lang="css">

P{ font-size: 110%;font-family: garamond, sans-serif;}

H2{ color: red;background: white;}

.highlight{color: red;background: yellow;font-weight: bold;}

</source>

在這個(gè)例子里有三個(gè)選擇器：<code>P</code>、<code>H2</code>和<code>.highlight</code>，<code>color: red</code>是一定義，其中<code>color</code>是屬性，<code>red</code>是<code>color</code>的值。

在這里HTML種的結(jié)構(gòu) <code>P</code>（段落）和 <code>H2</code>(二級(jí)標(biāo)題)獲得了不同的樣式，每個(gè)段落的字體的大小比包含這個(gè)段落的結(jié)構(gòu)的姿態(tài)的大小要大10%，其中字形是<code>Garamond</code>，假如<code>Garamond</code>沒有的話，那么使用一般的<code>sans-serif</code>字形。2級(jí)標(biāo)題的字用紅色，底面是白色的，這個(gè)例子中的第三個(gè)規(guī)則規(guī)定了一個(gè)<code>class</code>的樣式，通過<code>class</code>屬性每個(gè)HTML結(jié)構(gòu)都可以被指定為這個(gè)<code>class</code>，例如：
<pre><nowiki><P class="highlight">這個(gè)段落將被顯示為黃底紅字粗體。</P></nowiki></pre>
顯示為
<div style="clear:both; color:red; background: yellow; font-weight:bold;">這個(gè)段落將顯示為黃底紅字粗體。</div>
CSS檔內(nèi)也可以包含注釋，注釋以<code>/*</code>開始，以<code>*/</code>結(jié)尾，例如：
<code>/* 注釋 */ </code>

==CSS縮寫規(guī)則==
使用 CSS 縮寫可以減少 CSS 文件的大小，并使其更為易讀<ref>[http://www.ficush.com/view/13 常用 CSS 縮寫語法總結(jié)]</ref>，例如：

1. 顏色縮寫：16 進(jìn)制的色彩值，如果每?jī)晌坏闹迪嗤?，可以進(jìn)行縮寫，例如：
#000000 可以縮寫為 #000，#336699 可以縮寫為 #369;

2. 盒尺寸縮寫：Property: Value1 Value2 Value3 Value4；四個(gè)值依次表示 Top，Right，Bottom，Left

3. 邊框縮寫

邊框的屬性如下：
     border-width: 1px;
     border-style: solid;
     border-color: #000;

可以縮寫為一句：border: 1px solid #000;

4. 背景縮寫

     background-color: #F00;
     background-image: url(Background.gif);
     background-repeat: no-repeat;
     background-attachment: fixed;
     background-position: 0 0;


可以縮寫為一句：background: #F00 url(Background.gif) no-repeat fixed 0 0;

==CSS發(fā)展歷史==
哈坤于1994年在芝加哥的一次會(huì)議上第一次提出了CSS的建議，1995年他與波斯一起再次提出這個(gè)建議。當(dāng)時(shí)W3C剛剛建立，W3C對(duì)CSS的發(fā)展很感興趣，它為此組織了一次討論會(huì)。哈坤、波斯和其他一些人（比如微軟的托馬斯·雷爾登）是這個(gè)項(xiàng)目的主要技術(shù)負(fù)責(zé)人。1996年底，CSS已經(jīng)完成。1996年12月CSS要求的第一版本被出版。 

* 1996年[[W3C]]正式推出了CSS1.
* 1998年W3C正式推出了CSS2.
* CSS2.1是W3C現(xiàn)在正在推薦使用的.
* CSS3現(xiàn)在還處于開發(fā)中.


----

== CSS學(xué)習(xí)教程 ==
*[[CSS學(xué)習(xí)教程]]

==CSS框架==
[[960網(wǎng)格系統(tǒng)]]

==css技巧匯聚==
*[[css內(nèi)em px]]

==相關(guān)條目==
[http://bbs.zzbaike.com/thread-54658-1-1.html 關(guān)于CSS樣式表]

==參考資料==
[http://www.blueidea.com/ 藍(lán)色理想]

==推薦書籍==


[[category:網(wǎng)頁制作|C]]
[[category:標(biāo)記語言|C]]
[[category:CSS]]
[[Category:W3C|C]]