SASS学习笔记_01
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的更多相关文章
- Sass学习笔记(补充)
阅读目录 1. Sass和SCSS的区别 2. @while循环 3. @at-root 4. @content 5. 凸显注释 6. CSS输出样式 7. 重置浏览器样式 8. Sass调试和@de ...
- Sass学习笔记之入门篇
Sass又名SCSS,是CSS预处理器之一,,它能用来清晰地.结构化地描述文件样式,有着比普通 CSS 更加强大的功能. Sass 能够提供更简洁.更优雅的语法,同时提供多种功能来创建可维护和管理的样 ...
- sass学习笔记1
less在处理CSS动画时,非常恶心,决定转向sass了.sass诞生得比less早,只是因为它是ruby写的,因此受众面够少.但我们不需要自己下编译器或使用命令行,我们可以koala这神器 首先几个 ...
- 菜鸟的 Sass 学习笔记
介绍 sass 是什么?? 在sass的官网,它是这么形容给自己的 Sass is the most mature, stable, and powerful professional grade C ...
- SASS学习笔记!(持续学习中..)
工具 : koala 学习网址 : http://www.w3cplus.com/sassguide/syntax.html http://sass-lang.com/documentation/ ...
- Sass学习笔记
语法 @each $var in <list>//循环就是去遍历一个列表,然后从列表中取出对应的值 @while $types > 0 //循环直到函数不成立 SASS函数 To-u ...
- SASS学习笔记(1)
序 之前稍微看过SASS的文档,但是由于工作中没有涉及,渐渐的搁置了.最近公司新招来一个热情似火的前端,不管什么技术,不管自己能不能hold住,都提出来用一用再说.这样对我也好,跟着这个哥们混妥妥的长 ...
- sass学习笔记2
今天介绍sass在重用代码时最具威力的两个功能.一个是嵌套(Nesting),一个混合(Mixin). 我们在写CSS通过需要多个后代选择器组合到一起才能定位到目标元素上,而这定义过程,此元素的父元素 ...
- SASS学习笔记2 —— 语法
sass有两种后缀名文件:一种后缀名为sass,不使用大括号和分号:另一种是scss文件,这种和我们平时写的css文件格式差不多,使用大括号和分号.在此也建议使用后缀名为scss的文件,以避免sass ...
随机推荐
- DevExpress 14.2 批量汉化 以及客户端的汉化
DXperience汉化方法介绍 运用慧都提供的DXperience汉化包,能将最新版本的DXperience WinForm和ASP.NET控件界面.弹出框.右键菜单等汉化成中文,且能根据自己的需求 ...
- Entity Framework Extended Library (EF扩展类库,支持批量更新、删除、合并多个查询等)
E文好的可以直接看https://github.com/loresoft/EntityFramework.Extended 也可以在nuget上直接安装这个包 1.先更新VS的NuGet版本http: ...
- php设计模式之单例、多例设计模式
单例(Singleton)模式和不常见的多例(Multiton)模式控制着应用程序中类的数量.如模式名称,单例只能实例化一次,只有一个对象,多例模式可以多次实例化. 基于Singleton的特性,我们 ...
- Thinkphp 下面执行crond
thinkphp开启cli支持 1.tp正好支持cli命令模式,手册的路径为13.7.4 如果是用的其他框架不支持cli,那么只能直接写程序了,其实就是写面向过程的最基础的php代码. 2.在入口文 ...
- 在EF的code frist下写稳健的权限管理系统:数据库模型(二)
先从数据库开始,因为是用EF的code frist,所以所有的设计都在解决项目中进行. 先是数据模型开始 我已经建立了四个模型,user,role,action,actiongroup user里面有 ...
- 3.html5的文本元素
如果你看了第一篇的内容,你会发现我的代码是这样的: 文本 <span>文本</span> <scolia>文本</scolia> <scolia ...
- [terry笔记]Oracle10g/11g安装-redhat5.5
操作系统准备工作 其实真正的进入图形界面安装是简单的,只是前期的配置比较繁琐,如版本.空间.位置.软件包.用户.环境变量.内核参数,这里主要讨论前期配置. 10g与11g的单实例安装基本一样,主要区别 ...
- 简单快速的开发框架-SRF
1.是什么 SRF(simply and rapid development framework) 一套基于asp.net mvc的开发框架,致力于提供简单.快速的企业应用开发方案,旨在解决企业应用开 ...
- OC编写使用调试器
OC编写使用调试器 编写代码免不了,Bug.那么Debug就是程序员的必备技能了.本文和大家一起探讨,如何在应用开发编写代码过程中,使用日志项消息:以及使用动作.条件.迭代控制增强断点. 记录信息 在 ...
- Linux下安装宋体以及微软雅黑字体
最近工作用itext生成pdf在windows环境下没有出现中文乱码而在linux下出现中文乱码,打开pdf查看pdf编码,以及显示的编码,发现编码并没有对应.原因是使用的宋体和微软雅黑在linux环 ...