配置Susy 2

whm156377發表於2020-03-14

   配置Susy 2


  就像上個版本一樣,如果你想使用Susy 2,就需要在config.rb檔案中引入susy:


  #config.rb


  require'susy'


  然後向樣式表中匯入Susy:


  //Importing Susy


   import'susy';


  Susy 2具有一系列內建的全域性預設配置。完全可以像如下方式修改預設配置:


  //Configuring Susy 2 Global Defaults


  $susy:(


  key:value


  );


  也許此時你會想深入瞭解使用這些預設配置的方式,不過我還是將相關內容另寫一篇文章吧。現在就請直接使用預設配置吧,但我個人來說,比較喜歡使用border-box和rem單位,所以這裡會有點小小的修改:


  $susy:(


  global-box-sizing:border-box,


  use-custom:(rem:true


  )


  );


  注意,Susy預設使用的時流失佈局。這意味著外部容器元素的寬度是100%。


  反之,如果你喜歡在Susy中使用精確斷點的固定佈局,那麼只需把math關鍵字的值修改為static即可。這兩種模式的主要區別就在於視窗寬度改變時的響應效果。


  另一點需要注意的是,你還需要在專案中匯入normalize和compass。簡而言之,最初的配置檔案如下所示:


   import"normalize";


   import"compass";


   import"susy";


  //Configuring Susy Defaults


  $susy:(


  global-box-sizing:border-box,


  use-custom:(rem:true


  )


  );


   include border-box-sizing;


來自 “ ITPUB部落格 ” ,連結:http://blog.itpub.net/69926583/viewspace-2680223/,如需轉載,請註明出處,否則將追究法律責任。

相關文章