scss两种格式

sass    大括号

scss   css写法

 

Arguments:  --no-cache –style compressed --update $FileName$:css/$FileNameWithoutExtension$.css

标示部分是  输出的css类型  和额外输出路径  就是 输出的css是不是压缩  然后项目目录建立css文件夹放到里面去

 

--style

nested:嵌套缩进的css代码

expanded:没有缩进扩展的css代码

compact:简洁格式的css代码

compressed:压缩后的css代码;

 

=====================================================

变量

$变量名:值;

$global-color:yellow

$global-border:1px solid $global-color;

调用

.nav{

background:$global;

}

标量嵌套

.navbar{

border:$global-border

}

嵌套规则:

 

引用符:

 

 

第一个 引用的是当前所在的元素

第二个是引用的所有父级元素

-----------------------------------------------------------------------

群组选择器嵌套

简化

-----------------------------------------------------------------------

子选择器属性

生成

-----------------------------------------------------------------------

属性嵌套

 

-----------------------------------------------------------------------

属性选择器2

------------------------------------------------------------------------

SASS学习笔记_01的更多相关文章

  1. Sass学习笔记(补充)

    阅读目录 1. Sass和SCSS的区别 2. @while循环 3. @at-root 4. @content 5. 凸显注释 6. CSS输出样式 7. 重置浏览器样式 8. Sass调试和@de ...

  2. Sass学习笔记之入门篇

    Sass又名SCSS,是CSS预处理器之一,,它能用来清晰地.结构化地描述文件样式,有着比普通 CSS 更加强大的功能. Sass 能够提供更简洁.更优雅的语法,同时提供多种功能来创建可维护和管理的样 ...

  3. sass学习笔记1

    less在处理CSS动画时,非常恶心,决定转向sass了.sass诞生得比less早,只是因为它是ruby写的,因此受众面够少.但我们不需要自己下编译器或使用命令行,我们可以koala这神器 首先几个 ...

  4. 菜鸟的 Sass 学习笔记

    介绍 sass 是什么?? 在sass的官网,它是这么形容给自己的 Sass is the most mature, stable, and powerful professional grade C ...

  5. SASS学习笔记!(持续学习中..)

    工具  : koala 学习网址 : http://www.w3cplus.com/sassguide/syntax.html  http://sass-lang.com/documentation/ ...

  6. Sass学习笔记

    语法 @each $var in <list>//循环就是去遍历一个列表,然后从列表中取出对应的值 @while $types > 0 //循环直到函数不成立 SASS函数 To-u ...

  7. SASS学习笔记(1)

    序 之前稍微看过SASS的文档,但是由于工作中没有涉及,渐渐的搁置了.最近公司新招来一个热情似火的前端,不管什么技术,不管自己能不能hold住,都提出来用一用再说.这样对我也好,跟着这个哥们混妥妥的长 ...

  8. sass学习笔记2

    今天介绍sass在重用代码时最具威力的两个功能.一个是嵌套(Nesting),一个混合(Mixin). 我们在写CSS通过需要多个后代选择器组合到一起才能定位到目标元素上,而这定义过程,此元素的父元素 ...

  9. SASS学习笔记2 —— 语法

    sass有两种后缀名文件:一种后缀名为sass,不使用大括号和分号:另一种是scss文件,这种和我们平时写的css文件格式差不多,使用大括号和分号.在此也建议使用后缀名为scss的文件,以避免sass ...

随机推荐

  1. 【项目相关】MVC中将WebUploader进行封装

    昨天初步将webuploader用在了项目中,但紧接着就发现了一个问题,每一个页面都需要写那么多初始化webUploader的代码,这样肯定是我不能接受的,于是花了半天时间对该控件进行了封装. 最后, ...

  2. JavaScript 一些基础练习

    JavaScript为网页添加动态效果并实现与用户交互的功能.改变颜色以及宽高,隐藏或显示内容,取消设置 <style type="text/css"> body { ...

  3. php 显示内存 释放内存

    <?php //这只是个例子,下面的数字取决于你的系统 echo memory_get_usage() . "\n"; // 36640 $a = str_repeat(&q ...

  4. Qt5 Addin 出现问题模块计算机类型“x64”与目标计算机类型“X86”冲突

    Qt5 Addin 出现问题   怎样VS2013下安装Qt5的插件   http://jingyan.baidu.com/article/a948d65159d8890a2dcd2e84.html ...

  5. 在Nginx 下运行 Laravel5.1 的配置

    一.nginx 的 vhost.conf 配置: server { listen ; server_name sub.domain.com; set $root_path '/srv/www/defa ...

  6. C#自定义导出数据到Excel中的类封装

    using System; using System.IO; using System.Data; using System.Collections; using System.Data.OleDb; ...

  7. 2016/09/21 java关键字static

    1.static方法     static方法一般称作静态方法,由于静态方法不依赖于任何对象就可以进行访问,因此对于静态方法来说,是没有this的,因为它不依附于任何对象,既然都没有对象,就谈不上th ...

  8. UCOS2_STM32F1移植详细过程(四)

    Ⅰ.概述 上一篇文章是讲述uC/OS-II Ports下面os_cpu_a.asm.os_cpu_c.c和os_cpu.h文件底层端口代码的移植(修改)和说明,接着上一篇文章来讲述关于UCOS移植应用 ...

  9. WPF实现3D翻转的动画效果

    1.前端代码实现 1.1 原理见代码注析 <Grid MouseDown="Grid_MouseDown"> <Viewport3D> <Viewpo ...

  10. Hashset,Iterator

    HashSet类主要是设计用来做高性能集运算的,例如对两个集合求交集.并集.差集等.集合中包含一组不重复出现且无特性顺序的元素. (一)HashSet的一些特性如下: 1.HashSet中的值不能重复 ...