zoukankan      html  css  js  c++  java
  • sass入门

    一、安装ruby(验证:ruby -v)
         gem install sass

         转化命令:sass test.scss test.css
         编译风格:
         * nested:嵌套缩进的css代码,它是默认值。
           * expanded:没有缩进的、扩展的css代码。
           * compact:简洁格式的css代码。
           * compressed:压缩后的css代码。
         生产环境多用:sass -style compressed test.scss test.css

         监听目录
         sass -watch test.scss:test:css(文件)
         sass -watch sasstest/csstest(文件夹)

    二、安装compass
         gem update
         gem install compass


         建立项目
          compass create mytest(文件夹)

         编译:compass compile
              compass compile -output-style compressed(压缩去注释)
              compass compile -force(重编未变动文件)
         配置文件config.rb中指定编译模式     ex:output_style = compressed;
        
         监听:compass watch(进入当前目录)


    三、compass核心框架
         * reset
           * css3
           * layout
           * typography
           * utilities
         (http://compass-style.org/reference/compass/css3/)

    四、compass安装blueprint Module
         $ compass install blueprint

    五、debug
         配置文件config.rb中sass_options = {:debug_info => true}
     

    CSS转换成Sass

    在现有的项目中通过“sass-convert”使用sass。

    在终端进入你的目录中,键入“sass-convert --from css --to sass -R .”。将CSS转换成Sass。其中“-R”表示递归,“.”表示当前目录。

  • 相关阅读:
    jQuery attr 与 prop 区别最简单分析
    Js事件处理模型/周期
    canvas实现点击带水纹的按钮
    js作用域问题
    js 函数里的 this
    css3: scrollLeft,scrollWidth,clientWidth,offsetWidth 的区别
    C# 中的Async 和 Await 的用法详解
    1、Task的优势
    探秘C#中的yield关键字
    详解C#中 Thread,Task,Async/Await,IAsyncResult的那些事儿
  • 原文地址:https://www.cnblogs.com/uh-huh/p/4303155.html
Copyright © 2011-2022 走看看