Board logo

標題: [介紹] 簡單的無名CSS教學|無名CSS樣式分享 [打印本頁]

作者: adj    時間: 2008-12-20 12:37     標題: 簡單的無名CSS教學|無名CSS樣式分享

不過在使用無名的css樣式之前,關於css的起源也是要有一些了解,其實css是英語Cascading Style Sheets的縮寫,它是一種用來表現HTML樣式的網頁語言,從1990年HTML被髮明開始css樣式表就以各種形式出現了,不同的瀏覽器可以結合了各自的css樣式語言,最初的HTML版本只含有很少的顯示屬性,是由讀者來決定網頁應該怎樣被顯示。


後來隨著HTML的成長,為了滿足設計師的要求,css獲得了很多顯示功能以增強HTML的需求,而無名的CSS樣式也是因此而誕生的。在CSS裡一個文件的樣式可以從其它的樣式表中繼承下來,所以讀者在有些地方可以使用自己喜歡的樣式。


1997年初,W3C內組織了專門管CSS的工作組,雖然CSS1規格1996年就完成了,但一直到三年後還沒有一個瀏覽器徹底實現了這些規格。2000年微軟在電腦上運行的Internet Explorer 5.0是第一個徹底貫徹CSS1的瀏覽器,此後許多其它瀏覽器也貫徹了CSS樣式,所以今天能在無名小站上分享css樣式,其實要感謝這些過去對css發展有所貢獻的人們,還有那些無名樣式設計達人們所作出的分享。


無名CSS主要是管理網頁中style(樣式)部分,也就是網頁中如文字、背景、連結、按鈕、表格…等相關的部份都可以用CSS去做修改。在css無名樣式分享裡中,可以利用設定好的CSS樣式表,指定給某一種HTML標籤或某一群組HTML標籤來使用,增加了更多的樣式定義方式來輔助HTML。


一開始使用無名樣式分享前,請先【登入無名】、【到自己的網誌】、【樣式管理】、【修改無名CSS樣式表】。

無名CSS語法規則如下:
語法型式:HTML標籤1, HTML標籤2{ 屬性名稱1 : 屬性設定值1;屬性名稱2 : 屬性設定值2;}

1.大括號前面的英文代表著你要修改無名樣式分享在HTML語法裡面的標籤名稱(HTML標籤)」,在下面的網頁會對每個無名相簿每個頁面介紹各個標籤的位置。大括號裡面代表著「加入的樣式」,屬性名稱(如color、font-size)以冒號(:)與屬性設定值(如#FFFFF、10px)隔開。比如說你要把HTML裡面body部分的字體改為黑色,無名css樣式寫法就是body{color:black}。

2.多個HTML標籤間以逗號 ( , ) 隔開;多個屬性名稱間以分號 ( ; ) 隔開。
例如我要同時在a:visited跟a:hover裡面設定字顏色為黑色及字體為arial,語法則為a:visited,a:hover{color:black;font-family:arial;}。

3.空格跟空行皆不影響無名css樣式語法,但注意屬性名稱跟設定值必須以一組大括號{}包圍起來。

4.「重覆設定」以後者為主。(ex:網頁中同時有body{color:red}及body{color:black}兩個語法,即對body顏色部份做了重覆的宣告,則跑出的結果會以後者"black"為主。)最後把你設計或修改的css無名樣式分享語法貼進去框框,再按存檔就可以完成修改了。

無名css樣式分享優點:
1.語法簡潔,可以很容易的控制HTML標記,易於掌控網頁元素的位置,只要更改標籤就可以任意且快速的做更改。
2.多種文字變化可以減少圖檔的使用,加快了網頁的傳輸速度。
3.集中管理樣式,使許多網頁共用一份無名CSS,減少了網頁的體積,維護及建立風格一致的網站更加容易。

無名css樣式分享缺點:
1. 瀏覽器的支援程度不同,使用不同的瀏覽器看同一個無名css網頁,往往會有不同的結果, CSS在這方面比HTML還要嚴重,所以在使用 CSS的時候要特別注意,不同的瀏覽器是否都能支援你的語法?所以至少IE跟firfox都要正常顯示,這才是最高境界。
2. 盡量不要與布景主題合用,否則會發生不相容的情況


無名小站 CSS 樣式分享:

Hala 無名






歡迎光臨 ADJ網路實驗室 (http://dz.adj.idv.tw/) Powered by Discuz! 6.0.0