網站建設是指使用標識語言(markup language),通過一系列設計、建模、和執行的過程將電子格式的信息通過互聯網傳輸,最終以圖形用戶界面(GUI)的形式被用戶所瀏覽。簡單來說,網頁設計的目的就是產生網站。簡單的信息如文字,圖片(GIF,JPEG,PNG)和表格,都可以通過使超文件標示語言、可擴展超文本標記語言等標示語言放置到網站頁面上。 關於CSS的概論 CSS是『Cascading Style Sheets』的簡稱,中文翻為「串接樣式表」,也有人只翻為「樣式表」。CSS用以作為網頁的排版與風格設計,在所謂的「新式網頁」里 ,CSS不容置疑是相當重要的一環。CSS是以既有的基礎,用以彌補既存HTML 規格里的不足,也讓網頁的設計更為靈活。
這份教學文件就要來為您介紹CSS的應用羅!在這邊并不介紹CSS的所有規格 ,僅就您在網頁寫作上較常用到,較可能用到的語法部份及應用的方法來為您作介紹。也 由於現在兩瀏覽器的相容是漸行漸遠,將貼心地為您注明支援該語法的瀏覽器。而IE從 3.0開始便支援部份語法了,這點也會為為您注明的。各章節的概略介紹 為了您參考與學習上的方便,在這里先為您大略地說明一下這份教學文件各章節所包含的內容吧!讓您在參考時有個方向與概念;旧希皟烧轮仂陡拍钆c基本認知的建立,也就是一些為您做一些札根的工作;第三章則為您補充在應用與設定上的一些其它方式或特性的說明與介紹。而第四章到第六章則著重於語法、參數與性質的介紹,也 就是真正建立在樣式表里面的東東。
第一章CSS的基本認識: 就是本章啦!就介紹您一些CSS基本概念與認識。第二章CSS的應用方式: 為您介紹CSS的基本宣告、應用方法與特性介紹。第三章CSS的應用補充: 為您介紹CSS的其它宣告方式、應用與特性介紹。第四章頁面性質的CSS: 為您介紹頁面性質的CSS相關語法、參數與性質。第五章文字性質的CSS: 為您介紹文字性質的CSS相關語法、參數與性質。第六章區塊性質的CSS: 為您介紹區塊性質的CSS相關語法、參數與性質。應用上的基本認識 應用CSS并不困難,但是請您先參考這里的基本認識,對一些用語有了一點基本概念後,對於您在看後面的教學會有助益,看起來也才不會太吃力!
一、基本用語的認識: 元件(element):亦即HTML基本語法中的標簽(tag)。 屬性(attribute):用以描述標簽特性的屬性。 例如: <HR WIDTH="90%">中,HR為標簽,WIDTH為屬性,而80%即為WIDTH屬性的值。性質(property):用以描述元件的特性。相當於HTML基本 語法中的屬性。 樣式(style):擁有一組或數組的性質,用以描述元件特性。 挑選者(selector):套用樣式的元件。 例如: H3{ COLOR : BLUE }中,H3為挑選者,COLOR為性質,BLUE為COLOR性質的值。二、基本單位的認識: 有相對單位與絕對單位兩種單位 表達方式。 相對單位: 『em』:相對於字母高度的比例因子。 『en』:相對於字型大小的比例因子。 『%』:相對於長度單位(通常是目前字型的大。┑陌俜直壤。絕對單位: 『in』:英寸。 『cm』:公分。 『mm』:公厘。 『px』:像素(系統預設單位)。 『pc』:pica,印刷活字單位。 『pt』:像點。相對關系:1in= 6pc= 72pt= 2.54cm= 25.4mm三、顏色使用的認識: 顏色的表示共有五種方式。 『#RRGGBB』: 以三個00到FF的十六進位值分別表示0到255十進位值的紅、綠、藍三原色數值。『#RGB』: 簡略表示法,只用三個0到F的十六進位值分別表示紅、綠、藍三原色數值。而事實上,瀏覽器會自動擴展為六個十六進位的值,如『#ABC』將變為『#AABBCC』。但是,顯見這樣的 表示法并不精確!簉gb(R,G,B)』: 以0到255十進位值的紅、綠、藍三原色數值來表示顏色!簉gb(R%,G%,B%)』: 以紅、綠、藍彼此相對的數值比例來表示顏色,如『rgb(60%,100%,75%)』!篊olor_Name』: 直接以顏色名稱來表示顏色,共有141種標準的顏色名稱。
四、URL表示法的認識: CSS的URL表示共有五 種方式,且都為合法宣告,您可以自行選用。 URL(http://yourweb/path/file_name) URL('http://yourweb/path/file_name') URL("http://yourweb/path/file_name") URL( 'http://yourweb/path/file_name' ) URL( "http://yourweb/path/file_name" ) 有了這些基本認識與概念後,接下來就要來為您介紹CSS的應用方法羅!大多數人在上網的時候,都會瀏覽網頁提供給我們的信息。
|