1.什么是预处理器?

  CSS预处理器是用一种专门的编程语言,进行Web页面样式设计,然后再编译成正常的CSS文件,以供项目使用。CSS预处理器为CSS增加一些编程的特性,无需考虑浏览器的兼容性问题。

  可以在CSS中使用变量、简单的逻辑程序、函数等等在编程语言中的一些特性,可以让你的CSS更加简洁、适应性更强、可读性更佳、更易于代码的维护等诸多好处。

例如:

$color : red ; //使用了变量$color
.test {
color : $color ;
}

2.CSS预处理语言:

  ▶Sass(SCSS)

  ▶LESS

  ▶Stylus

  ▶Turbine

  ▶Swithch CSS

  ▶CSS Cacheer

  ▶DT CSS

  到目前为止,在众多优秀的CSS预处理语言中,就属Sass、LESSStylus最优秀。

3.什么是Sass?

  Sass官网的描述是:Sass是一门高于CSS的元语言,它能用来清晰地、结构化地描述文件样式,有着比普通CSS更强大的功能。Sass能够提供更简洁、更优雅的语法,同时提供多种功能来创建可维护和管理的样式表。

  Sass是采用Ruby语言编写的一款CSS预处理语言。有着和HTML一样的缩进风格。

4. Sass和SCSS有什么区别?

  Sass和SCSS其实是同一种东西,两者的区别有:

  ▶文件扩展名不同:Sass是以".sass"后缀为扩展名,而SCSS是以".scss"后缀为扩展名。

  ▶语法书写方式不同:Sass是以严格的缩进式语法规则来书写,不带大括号({})和分号(;),而SCSS的语法书写和我们的CSS语法书写方式非常类似。

  看下面的例子:

Sass语法

$font-stack : Helvetica , sans-serif      //定义变量
$primary-color : #333 //定义变量 body
font : 100% $font-stack
color : $primary-color

SCSS语法

$font-stack : Helvetica , sans-serif;
$primary-color : #333; body {
font : 100% Helvetica , sans-serif;
color : #333;
}

编译出来的CSS

body {
font : 100% Helvetica , sans-serif;
color : #333;
}

Sass入门:第一章的更多相关文章

  1. MySQL----MySQL数据库入门----第一章 数据库入门

    第一章 数据库入门 1.1 数据库基础知识 1.1.1 数据库概述 数据不仅包括普通意义上的数字,还包括文字.图像.声音等.也就是说,凡是在计算机中用来描述事物的记录都可称作数据. 数据库的基本特点: ...

  2. JAVA 入门第一章(语法基础)

    本人初学java 博客分享记录一下自己的学习历程 java我的初步学习分为六章,有c和c++的基础学起来也简便了很多. 第一章 语法基础 第二章 面向对象 第三章 常用工具类 第四章 文件操纵 第五章 ...

  3. 关于阮大神的es6标准入门第一章

    题记:之前在10月份的时候写过阮大神的es6的第一章,但是由于那段时间项目组的动荡,所以也没有什么后续,导致我现在对es6基本都忘的差不多了,不过,现在换了新公司,最近也没什么任务,所以现在开始重新写 ...

  4. C基础入门 - 第一章 - C语言绪言

    第1章 C语言绪言 1.1 C语言概述 1.1.1 C语言世界 1.1.2 C语言学习, 能当饭吃吗 1.2 开发环境构建 1.2.1 visual studio安装使用 1.2.2 visual s ...

  5. Java入门第一章

    后天就是十一长假了,亲们准备好了去哪儿玩了吗? 今天有点空,就来聊聊Java吧,当然是一些Java入门知识了,网上有很多,这里我只是列举一些我自己学到的,感谢大家关注喵的博客这么久,也为大家带来点新知 ...

  6. RabbitMQ 消息队列 入门 第一章

    RabbitMQ : 官网:https://www.rabbitmq.com/ GitHub:https://github.com/rabbitmq?q=rabbitmq 第一步安装: 点击  htt ...

  7. Java入门第一章知识点总结

    -d是directory 目录的意思 cls:清楚doc里面的内容 ipconfig:显示网络配置信息 java -version:检查安装的jdk版本信息 是类型自动向上转换.  在输出时,根据当前 ...

  8. Linux基础入门 第一章:Linux环境搭建——Redhat 6.4图文安装教程

    1.创建新的虚拟机 2.选择自定义 3.选择Workstation 10.0 4.选择稍后安装操作系统 5.选择Red Hat 6 64位 6.对虚拟机命名和选择安装位置 7.选择处理器配置 8.选择 ...

  9. mvc5+ET6入门第一章

    这一篇主要讲的是MVC也就是Model--View--Controller的缩写,没有讲ET.其中 Model(模型)表示应用程序核心(比如数据库记录列表).通常模型对象在数据库中存取数据. View ...

  10. HTML与CSS入门——第一章 理解Web的工作方式

    知识点: 1.万维网的简史 2."网页"的含义,以及该术语不能反映所涉及的所有内容的原因 3.如何从你的个人计算机进入别人的浏览器 4.选择Web托管提供商的方法 5.不同的Web ...

随机推荐

  1. openstack私有云布署实践【8.1 身份认证keystone的API创建(科兴环境)】

    其中一台controller上面加入环境变量,我选kxcontroller1,关注的是endpoint的名称不一样,其它创建的参数与测试环境一致 export OS_TOKEN=venicchina ...

  2. 【转】关于JVM CPU资源占用过高的问题排查

    http://my.oschina.net/shipley/blog/520062 一.背景: 先执行一个java程序里面开了两个线程分别都在while循环做打印操作. ? 1 # java -cp  ...

  3. JSON对象和字符串的转换

    JSON.parse()和JSON.stringify()   1.parse 用于从一个字符串中解析出json 对象.例如 var str='{"name":"cpf& ...

  4. 【LeetCode】23. Merge k Sorted Lists

    合并k个已合并链表. 思路:先把链表两两合并,直到合并至只有一个链表 /** * Definition for singly-linked list. * struct ListNode { * in ...

  5. C# 连接 Access 数据库

    c#连接Access 数据库需要System.Data, System.Data.OleDb using System.Data using System.Data.OleDb public OleD ...

  6. 开通域名绑定DDNS

    一.初衷 我想要有一个自己的域名,然后有自己的server,在server上搭一个网站或者开通一个ftp服务,我想通过这个域名来访问它. 二.什么是DDNS DDNS 动态dns,电信宽带采用拨号联网 ...

  7. 从源码Build vim以及打包.deb

    How to build vim 1. Build步骤 git clone --depth https://github.com/vim/vim.git # download the source c ...

  8. ubuntu下update-alternatives命令的使用

    在ubuntu系统中,update-alternatives是专门维护系统命令链接符的工具,其可以对某个工具的多个软件版本进行管理,通过它可以很方便的设置系统默认使用哪个命令的哪个软件版本. 在命令行 ...

  9. 从minist database(t10k-images-idx3-ubyte)中读取图片

    matlab代码(亲测,可运行出来): % Matlab_Read_t10k-images_idx3.m % 用于读取MNIST数据集中t10k-images.idx3-ubyte文件并将其转换成bm ...

  10. css基础和心得(二)

    css中的某些样式是具有继承性的.它允许样式不仅应用于某个特定html标签元素 而且应用于其后代.如: p{color:red;}  <p>dsffd<spans>sdfasd ...