scss Susy配置

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了scss Susy配置相关的知识,希望对你有一定的参考价值。

$susy: (
  flow: ltr, // сменить дефолтное навправление колонок, можно задавать переменной и менять для арабских сайтов
  math: fluid, // можно использовать static для неадаптивных сайтов (если вы такие еще делаете)
  output: float, // используйте outside для исправлениях некоторых багов
  gutter-position: after, // возможны разные варианты, например, before и inside
  container: auto, // укажите максимальную ширину в любых единицах, например, 60em
  container-position: center, // если вы хотите сделать не по центру, то можно использовать left и right
  columns: 12, // количество колонок
  gutters: .25, // ширина пробельчика для каждой колонки
  column-width: false, // ширина колонки задается только при math: static
  global-box-sizing: content-box, // можно задать border-box, но иногда проще использовать border-box миксин из компаса
  last-flow: to, // последний элемент в ряду флоатится вправо, можно сменить
  debug: (
    image: hide, // варианты: show | hide | show-columns | show-baseline для показа всех вариантов колонок и линеечек
    color: rgba(#66f, .25), // менять цвет у колонок
    output: background, // есть еще вариант overlay, в котором колонки показываются только при наведении
    toggle: top right, // положение переключателя для показа оверлея
  ),
  use-custom: ( // для каждого из них если включить true будут использоваться миксины из Compass или ваши собственные)
    background-image: true, // возможность использовать свой миксин background-image
    background-options: false, // разные background миксины
    box-sizing: true, // свой миксин box-sizing
    clearfix: false, // свой миксин clearfix
    rem: true,
  )
);

以上是关于scss Susy配置的主要内容,如果未能解决你的问题,请参考以下文章

scss 波旁Susy流体布局与静态排水沟

scss 波旁Susy流体布局与静态排水沟

scss Bootstrap网格,使用Susy和include-media

scss SUSY - созданиеклассовдлясетки

带有 webpack 和 sass-loader 的 Susy 网格

由于版本冲突,无法安装 sass + compass + susy