整理優化你的CSS代碼

2020-03-24 17:03:36

字體：大中小

來源：轉載

供稿：網友

view plaincopy to clipboardprint?
!--[if IE 6]
link rel="stylesheet" type="text/css" href="ie6.css"
![endif]--
!--[if IE 6]
link rel="stylesheet" type="text/css" href="ie6.css"
![endif]-- 這段代碼使得IE6去下載額外的ie6.css解析它專用的css代碼。同樣的，如果針對IE7只用把上面的6與7替換就行了。 3.使用留白無論是為了自己閱讀還是二次開發，都要讓CSS保持良好的可讀性，留白就充當了關鍵的角色。我們不鼓勵你為了得到一個更小的CSS文件，就去掉所有的空白格式，如tab，換行，空格等。這里推薦嵌套的代碼使用一個tab縮進，所有屬性獨立一行。對比上下的圖片，是哪一種格式能讓你更加節約修改的時間呢？留白會讓你更加容易管理代碼。 4.移除多余的frameworks和resets Nathan Smith的 960 Grid System CSS framework使用的重置規則如果你選擇使用CSS framework，包括你自己寫的，如果你去檢查代碼一定會發現該framework包含的一些規則并不適用于你當前的文件，它們是可以被刪除的。由此可以想到的還有reset，YUI Grid CSS使用的reset和Eric Meyer's Reset 目前都很流行， Resets能夠移除不同瀏覽器的默認樣式，使得頁面在各個瀏覽器之間的表現一致。但是它們通常包含了一個大的網站需要的所有屬性，一些例如pre,code,sub,dfn,var等等屬性對于普通網站來說根本不會用上，刪掉那些你用不上的。Eric Meyer也會鼓勵你這樣做！ framework和reset會很好的幫助你的工作，但是如果不去掉那些你用不上的使用，反而會拖累你頁面的效率和可讀性。
5.擴展的CSS Doug Bowman的 stopdesign.com CSS 為層使用特殊的選擇器另一種優化你的代碼的方法就是分別為層進行具體的屬性聲明。 6.記錄你的工作在團隊協作中，溝通書寫標準，編碼規范，注釋方法，風格極為重要。規則是建立在一個一致的方法的標準。這樣能夠防止別人重復你已經做過的工作，防止代碼的膨脹。 7.壓縮使用為了使得瀏覽器節省更多下載個載入時間，壓縮是一個不錯的解決方案，但是僅限于發布的時候。YUI Compressor 和 CSSTidy 就是這樣方面的專家，他們能夠去除多余的代碼，校驗屬性互相覆蓋的錯誤。許多流行的編輯器，比如BBEdit, TextMate, 和 TopStyle 都能夠幫助你格式化你的CSS代碼成你想要的樣子。你還能通過服務器壓縮技術使用PHP處理你的CSS。你可以找到更多的CSS優化和壓縮的CSS工具。有一點，這些程序盡可能會降低錯誤的發生，但并不是完美的。同樣，最好不要用他們去處理包含CSS hack的文件。這也是另一個讓那些hack儲存在另外的文件里的原因。結束 -------------------------------------------------------------------------------- 整潔和優化的代碼不只是你的文件大小，還包括了維護性和可讀性。以上的原理并不只是針對CSS，它們還能應用到HTML，Javascript以及其他編程語言。CSS文件不只是為了呈現給你網站的最終用戶。上面的原理可以幫助用戶體驗以及開發者經驗。運用這些原則到你未來的項目中，一定能夠獲得重大的成效。
html教程

鄭重聲明：本文版權歸原作者所有，轉載文章僅為傳播更多信息之目的，如作者信息標記有誤，請第一時間聯系我們修改或刪除，多謝。

上一篇：如何使用html5與css3完成google涂鴉動畫

下一篇：css怎么設置透明度