通擎網絡科技是專業提供合肥網絡推廣、合肥網站推廣、網站優化、企業網站建設、短視頻(pín)運營推廣等網絡營銷推廣外(wài)包服務的合肥網絡公司!                          

網站首頁 >網站制作 > 網絡推廣知(zhī)識

建站前端必備:讓代碼活起來的CSS工(gōng)具

分(fēn)享到:
點擊次數:2088 更新時間:2016年03月30日11:20:28 打印此頁 關閉
CSS作爲網頁設計制作的一(yī)門基礎語言,在網頁設計中(zhōng),它表現出了其獨特的優勢。例如更簡潔的語言,模塊化的結構。

對于頁面開(kāi)發而言是設計排版的改進、對于訪客用戶而言則是有助浏覽速度的提高。而在開(kāi)發維護以及在做被搜索時的SEO,使用CSS都是目前最好的選擇。爲了更好的對CSS進行開(kāi)發,我(wǒ)們可以選擇一(yī)些有幫助的工(gōng)具。
下(xià)面來看看有哪些實用CSS工(gōng)具:
 
Base
  Base是一(yī)款輕量級CSS預處理工(gōng)具,能夠将代碼編譯爲SASS(即Syntactically Awesome CSS)或者LESS(Leaner CSS)。盡管已經有很多框架放(fàng)棄了IE浏覽器的支持,Base仍然堅定扮演着IE擁護者的角色,Matthew Hartman表示——他設計Base的初衷在于幫助設計師們編寫出更爲簡潔且結構清晰的CSS代碼。

  盡管目前的版本仍專注于面向桌面系統,但Hartman已經開(kāi)始着手創建下(xià)一(yī)個版本、旨在利用經過修改的代碼庫将移動平台作爲首選環境。他指出,Base“在最初進行開(kāi)發時隻具備非常基本的功能,但随着其迅速發展、我(wǒ)開(kāi)始将其應用在更多不同類型的網站當中(zhōng)。雖然遇到過許多前所未有的情況以及令人沮喪的錯誤,但這段學習經曆既可怕又(yòu)充滿樂趣。”

Compass
  Compass CSS驗證框架能夠爲設計師們帶來更爲簡潔的标記、可重複使用模式同時大(dà)大(dà)簡化了Sprite圖像——像這樣的優勢還有很多。“它并不是一(yī)套難于上手且需要預先定義的類名稱集合。Compass當中(zhōng)所包含的工(gōng)具數量超過了其它任何CSS框架,”開(kāi)發人員(yuán)Lorin Tackett表示,他利用這套框架創建出了一(yī)款網格計算器。“Compass充分(fēn)考慮到了那些在未來可能出現的浏覽器支持沖突狀況,因此其中(zhōng)一(yī)部分(fēn)功能可以有選擇地加以關閉。”

  Tackett指出,Compass是維護複雜(zá)Web應用程序中(zhōng)樣式表格的最佳選擇。


Foundation
  Foundation框架的專長在于響應式設計,這是一(yī)套專門用于創建網站與Web應用的策略方案,能夠自動與用戶設備上的浏覽器環境進行适配。

  “Foundation是第一(yī)款專門幫助用戶創建能夠運行在任何設備上的響應式站點的CSS框架,”Web設計機構Zurb合作夥伴兼Foundation設計主管Jonathan Smiley指出。“我(wǒ)們自發布首個公共版本開(kāi)始就一(yī)直緻力于打造響應式站點,而且在經曆了五個版本的實踐研發過程後、我(wǒ)們已經親眼見證了衆多開(kāi)發者在創建多設備應用及站點方案時所遭遇的難題,因此有能力幫助他們順利度過難關。”

  Foundation使用SCSS(即Sassy CSS),提供内置組件以簡化布局與原型設計,同時允許用戶以覆蓋方式使用自己的定制化前端。

Gumby
  上世紀七十年代出生(shēng)的朋友們可能還對Gumby這位活躍在兒童電視節目上的綠色黏土動畫人物(wù)留有印象,而如今同樣的名字則代表着一(yī)款CSS框架。

  “Bumby這個名字來自定格動畫片中(zhōng)的人物(wù),代表着能夠爲用戶帶來快速的原型設計體(tǐ)驗,”Gumby框架出品方Digital Surgeons公司執行創意總監Peter Sena指出。

  Gumby提供了多種網格與列式變化,其UI包中(zhōng)還包含按鈕、字體(tǐ)以及表單等等。Gumby旨在幫助業餘開(kāi)發人員(yuán)編寫并維護成百上千行代碼,Sena表示。目前其版本号爲2.6,預計Gumby 3将新增更多目前尚不支持的屏幕尺寸與設備型号,例如某些高分(fēn)辨率平闆設備與觸控式筆記本等。

Kube
  Kube标榜自身是一(yī)款“專業級”CSS框架。盡管其它框架同樣能夠提供預定義樣式以構建起視覺效果相似的站點外(wài)觀,但Kube的使用感受更加簡單,Kube項目首席開(kāi)發者之一(yī)Artem Rosnovskiy解釋稱。

  “Kube并不會強制限定任何樣式規則或者形式,”Rosnovskiy表示,而這一(yī)特性使其在專業設計師與開(kāi)發人員(yuán)群體(tǐ)當中(zhōng)獲得了廣泛歡迎。“很多初學者希望能夠在預定義創建流程之前獲取更多指導性意見——包括色彩、網格、按鈕以及樣式等等——但Kube則爲設計師與開(kāi)發人員(yuán)們帶來了徹底的自由空間……它要求使用者擁有老練的技能、經驗并透徹理解自己想要達成的效果。”

Responsive Grid System
  Responsive Grid System既不屬于框架也不屬于樣闆,而是一(yī)種能夠“快速而簡單”的響應式網站創建方式,項目開(kāi)發者Graham Miller解釋道。Responsive Grid System能夠直接與現有HTML與CSS相對接。

  “我(wǒ)發現一(yī)旦自己開(kāi)始着手創建響應式網站,最最需要的就是能夠快速切入到自己的現有代碼中(zhōng)并以高度靈活的方式構建任何項目,”Miller表示。“我(wǒ)曾經使用過很多不同類型的框架與樣闆,但它們都傾向于讓我(wǒ)以其爲基礎設置網格體(tǐ)系、然後向其中(zhōng)填充内容。我(wǒ)是那種‘内容至上’派的開(kāi)發人員(yuán),因此我(wǒ)建立了自己的響應式網格系統。”


上一(yī)條:新建網站快速提升網站PR值教程 下(xià)一(yī)條:建站前端技術:HTML5繪圖工(gōng)具