漂亮樣式表在XHTML CSS網頁製作的應用程式_HTML/Xhtml_網頁製作

這是一篇很久以前的文章了，現在看來，其中的思想很值得大家學習，在jb51.net學習案例的同時，不彷學習一些理論的知識，對您知識的突破會很有幫助。大家加油！

　　自從看了Zeldman先生的力作「Designing with Web Standards」中文版為《網站重構》（第2版）一書，感受頗深，堅定了我用web標準的思想，去開發實踐我們的項目。但僅知道一些什麼是web標準以及如何應用在實際專案中，還是遠遠不夠的。必須對web標準中的每個組成部分，逐一學習應用，各個擊破，方能發現它們的本質！對於像我這樣的web開發設計人員，懂得這個道理，進行針對性的學習與實踐，我相信我們一定會收穫的更多，同時也算是為web標準在中國的應用做一點貢獻！ （呵呵，這可能有些吹牛，但是的確是我們大多數軟體從業人員的理想。）

　　現在是web2.0乃至3.0的時代，是XHTML,XML,CSS,ECMAScript和DOM的時代。雖然它們不是最終的技術，但它們組合起來就成為一個解決方案——我們規劃建立一個向後相容的網站的基礎，同時也是做符合web標準的網站的必要的技術基礎。我們不僅要做到希望獲得更多的用戶支持與訪問，更要建立長久的，漂亮的網站長時間吸引他們的注意力。我相信學會使用CSS來改善我們的網站，是吸引他們注意力的好方法，也是在web2.0時代中時髦的發展趨勢。下面我僅就CSS技術談一下我從中獲得到的經驗。

　　想成為CSS專家，僅僅熟練使用CSS選擇符（selectors）是遠遠不夠的。還在於對工作的整體規劃，工作流程的掌握以及提高樣式表的可維護性和效率。用CSS可以創造出我們想要的美妙絕倫的網站，而寫CSS本身就是一種享受。 那麼我們該如何創造更具吸引力的樣式表呢？你的樣式表應該要有哪些特性呢？透過學習並結合我自己的工作經驗，總結出一套製作精美樣式表的好方法。

　　一、不要讓CSS有過多的標記

　　連結或匯入樣式表聽起來好像是一種無頭緒的工作。我看過很多的網站開發都有整潔的、組織嚴密的css文檔，但是慢慢的，由於可能達不到在短期內快速更新，或者懶得再去管理，這使得先前創建的精緻的樣式表變成了垃圾。如果我們工作在需要發佈上百條內容的龐大網站上面。因為時間有限，所以你需要透過巢狀或排列css來進行快速修改或更新。隨著時間的推移，這種習慣維持著，直到有一天你被告知這個網站要完全推翻重新設計（但是內容還是一樣）而且你只有一周的時間去創建（包括測試）。一般來說，更新樣式表還算是一個非常簡單的方法，除非你長時間對網站零散的區域做修改，你就不能對網站樣式表結構有一個整體的把握。

　　連結或匯入你的樣式表不是隨意的事情。創建乾淨整潔的樣式表並保持下去，工作就會更開心。注意：如果你試圖在每次更新或新增新內容的時候建立新的樣式表，那你一定是在自找麻煩。過多的連結和匯入樣式表會使消除bug變得異常困難，讓樣式表很難維持。大一點的網站分別建立不同部分的樣式表這是可以理解的。就是小心不要走極端。增加很多的樣式表，會增加更多的http請求，可能還會影響到後面的工作。

　　二、語意定義明確易懂

　　除了選擇最適合的，最有意義的元素來表達外，還要確定選擇class 和id屬性值。定義明確可以讓維護變得簡單，小組裡的成員都會看懂。看這個定義：

　　.l10k { color: #369; } ，.left-blue { color: #369; } ，如果是我做的我可能知道是啥懂了。即使今天知道它的意思，但能保證很多年後還知道它的意思嗎？ 最好不要在類屬性裡面去加入顏色或長寬的尺寸。更恰當的命名規範：. work-description { color: #369; }

　　三、知道何時加入有條件的註解與運用技巧

　　很多文章寫過一些關於問題解決的技巧，有條件的註解是控制IE發布的一個好方法。我同意有條件的註解比在你的css文件裡亂寫要好得多，但是最近我開始慢慢意識到，很多證據表明，這並不是最好的解決辦法。想在一個元素中設定它的最低高度，但是IE6瀏覽器卻不執行它，所以你知道自己能夠使用的高度，也同樣會被同樣的處理。重新建立一個樣式表，然後把有條件的註解加入你的標識中，你所有的需要都是要遵守這個規定？保持最低的高度和高度的規則在一起，選擇一個小技巧在同樣的css文檔裡，這樣會更好嗎？在這種情況下，我覺得用這種方法很難奏效。

　　四、應用CSS到網頁中盡量使用外部樣式表

　　好處嗎？大家都比較清楚，當然有一點是不可否認的，可以最大限度的實現程式碼的重複使用及最優化設定網站檔案。
　　好了，以上就是我的一些個人見解，希望各位朋友們多給提意見，您的建議是我挑戰困難的動力！謝謝！

以上就是漂亮樣式表在XHTML CSS網頁製作中的應用_HTML/Xhtml_網頁製作的內容，更多相關內容請關注PHP中文網（www.php.cn）！