CSS樣式架構[4] 模組套件型 (Module)

082 月

CSS樣式架構[4] 模組套件型 (Module)

模組套件型樣式是指分頁模組樣式pager.css、表單模組樣式form.css、或該頁面有套用到什麼jQuery的效果,伴隨該jQuery所產生的css,這些css就都放在資料夾「c」或「css」底下的「module」裡。jQuery所產生的css會以jQuery開頭後面再加上該plugin的名稱,以便識別。

名稱範例:

  • form.css
  • jquery.datepick.css
  • jquery.jcarousel.css
  • jquery.jcarousel.skin.css
  • jquery.recurselect.css
  • jquery.ui.tabs.css
  • pager.css

這類的樣式本身要作好樣式重置的工作,以便於獨立套用及整合。同時在引入這類樣式之前,也要先做好未引用JS特效前的樣式,因為JS效果套用到網頁的速度會比CSS慢,所以為了避免在JS未引入前,版面會跑掉,就要先預設好樣式,要作到就算未引入JS,版面也跟引入JS後一樣的呈現 (漸進增強、平穩退化)。

Posted by admin  Posted on 08 2 月 
  • CSS, jQuery
  • Post Comments 0