《CSS線上手冊》為官方CSS線上參考手冊,本CSS線上開發手冊包含了各種css屬性、定義、使用方法,實例運行等,是WEB程式設計學習及開發者不可或缺的線上查詢手冊! CSS:層疊樣式表(英文全名:Cascading Style Sheets)是一種用來表現HTML(標準通用標記語言的一個應用)。
CSS即層疊樣式表(英文全名:Cascading Style Sheets)是一種用來表現HTML(標準通用標記語言的一個應用)或XML(標準通用標記語言的一個子集)等文件樣式的電腦語言。
CSS不僅可以靜態修飾網頁,還可以配合各種腳本語言動態地對網頁各元素進行格式化。
CSS能夠對網頁中元素位置的排版進行像素級精確控制,支援幾乎所有的字體字號樣式,擁有對網頁物件和模型樣式編輯的能力。
提示:在繼續學習CSS之前,你需要對HTML以及XHTML知識有基本的了解。
CSS語言基礎
屬性
#屬性的名字是一個合法的標識符,它們是CSS語法中的關鍵字。一種屬性規定了格式修飾的一個面向。
例如:color是文字的顏色屬性,而text-indent則規定了段落的縮排。
屬性值
#整數與實數
長度量
百分數
#選擇器
CSS選擇器用於選擇你想要的元素的樣式的模式。 HTML頁面中的元素就是透過CSS選擇器來控制的。
每一條css樣式定義由兩個部分組成,形式如下:
[code] 選擇器{樣式} [/code] 在{}之前的部分就是「選擇器」。 「選擇器」指明了{}中的「樣式」的作用對象,也就是「樣式」作用於網頁中的哪些元素。
下面就介紹樣式表定義給大家是如何顯示 HTML 元素的。
建立並執行第一個CSS實例!
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文网(php.cn)</title> <style> body { background-color:#d0e4fe; } h1 { color:orange; text-align:center; } p { font-family:"Times New Roman"; font-size:20px; } </style> </head> <body> <h1>CSS 实例!</h1> <p>这是一个段落。</p> </body> </html>
是不是非常簡單! CSS為HTML標記語言提供了一種樣式描述,定義了其中元素的顯示方式。 CSS在Web設計領域是一個突破。利用它可以實現修改一個小的樣式更新與之相關的所有頁面元素。
提示:我們的CSS教學將幫助您逐步如何使用 CSS 同時控制多重網頁的樣式和佈局。如果你有任何疑問,請前往PHP中文網CSS社群提出你的問題,會有熱心網友為你解答。
CSS語言的特點
豐富的樣式定義:CSS提供了豐富的文件樣式外觀,以及設定文字和背景屬性的能力;允許為任何元素建立邊框,以及元素邊框與其他元素之間的距離,以及元素邊框與元素內容間的距離;允許隨意改變文字的大小寫方式、修飾方式以及其他頁面效果。
易於使用和修改:CSS可以將樣式定義在HTML元素的style屬性中,也可以定義在HTML文檔的header部分,也可以將樣式聲明在一個專門的CSS文件中,以供HTML頁面引用。總之,CSS樣式表可以將所有的樣式聲明統一存放,進行統一管理。
另外,可以將相同樣式的元素進行歸類,使用同一個樣式定義,也可以將某個樣式套用到所有同名的HTML標籤中,也可以將一個CSS樣式指定到某個頁面元素中。如果要修改樣式,我們只需要在樣式清單中找到相應的樣式聲明進行修改。
多重頁面應用程式:CSS樣式表可以單獨存放在一個CSS檔案中,這樣我們就可以在多個頁面中使用同一個CSS樣式表。 CSS樣式表理論上不屬於任何頁面文件,在任何頁面文件中都可以將其引用。這樣就可以實現多個頁面風格的統一。
層疊:簡單的說,層疊就是對一個元素多次設定同一個樣式,這將使用最後一次設定的屬性值。例如對一個網站中的多個頁面使用了同一套CSS樣式表,而某些頁面中的某些元素想使用其他樣式,就可以針對這些樣式單獨定義一個樣式表應用到頁面中。這些後來定義的樣式將對前面的樣式設定進行重寫,在瀏覽器中看到的將是最後面設定的樣式效果。
頁面壓縮:在使用HTML定義頁面效果的網站中,往往需要大量或重複的表格和font元素形成各種規格的文字樣式,這樣做的後果就是會產生大量的HTML標籤,從而使頁面檔案的大小增加。而將樣式的聲明單獨放到CSS樣式表中,可以大大的減少頁面的體積,這樣在載入頁面時使用的時間也會大大的減少。另外,CSS樣式表的複用更大程度的縮減了頁面的體積,減少下載的時間。
本CSS教學手冊涵蓋的內容
本CSS教學手冊涵蓋了所有CSS基礎知識,包含CSS定義、CSS語法、CSS屬性、CSS使用方法、 CSS響應式的介紹以及許多線上實例和完整的CSS屬性參考手冊等等。
提示:本教學的每一章都包含了很多CSS實例,您可以直接點擊 "運行實例" 按鈕在線查看運行結果。這些例子將幫助您更好地理解和使用CSS語言。
其它CSS相關學習參考資源
除了本頁面右邊的知識拓展,也為大家精選了以下資源
#最新章節
相關課程
- Web前端開發極速入門 2021-12-10
- 最懂你的大前端課:HTML5/CSS3/ES6/NPM/Vue/...【原文】 2022-09-30
- Gulp入門影片教學 2022-04-18
- 兄弟連高洛峰CSS3影片教程 2022-04-20
- AngularJS開發Web應用程式基礎實例影片教學 2022-04-18
- Ajax全接觸 2022-04-13
- MUI框架基礎影片教學 2022-04-13
- 線上訓練班試聽課 2019-01-10