之前觉得关于css什么的没什么,后来让别人给问住了。。。然后就悲催了。。。

sass是一种css的预处理器,是一种函数式的css的编程;

主要还是看官网 http://www.w3cplus.com/sassguide/     这个是基于Ruby

1.需要安装:

可以直接自己去看官网或者看下面我写的这个安装步骤(有试过是对的)

(1)如果你的电脑里面没有安装rudy 可以直接去看文档(额。。。好想还是要看官网)

(2)检测rudy是否安装好 cmd----rudy -v 看是否出现出版本号

(3)在cmd中gem install sass(gem需要代码 解决:安装淘宝rufyGems镜像 直接这个地址 https://ruby.taobao.org/)

(4)这样就可以了

2.sass应用

(1)新建文件夹中新建一个xxx.scss(这就是sass的对应的文件)

(2)在xxx.sass中写入代码

(3)在cmd中编译进入文件夹中,执行cmd中sass index.scss index.css(前一个是原来的;后一个是目标的)

注意:在你编译的时候可能会出现多余的文件,那是在编译的时候自动生成的

(4)这就好了,然后将index.css引入到index.html中去用就可以了

语法:http://www.w3cplus.com/sassguide/syntax.html

css的一种预处理器 sass的更多相关文章

  1. CSS预处理器Sass(Scss)、Less、Stylus

    CSS 预处理编译器能让我成程序化其的方式编写CSS代码,可以引入CSS中没有的变量.条件.函数等特性,从而让代码更简单易维护,但一般按预处理器语法编写的代码无法直接在浏览器中运行,需用通过工具比如g ...

  2. CSS预处理器——Sass、LESS和Stylus实践

    CSS(Cascading Style Sheet)被译为级联样式表,做为一名前端从业人员来说,这个专业名词并不陌生,在行业中通常称之为“风格样式表(Style Sheet)”,它主要是用来进行网页风 ...

  3. css预处理器 sass和stylus对比以及常用功能

    在众多的css预处理器语言中,sass和stylus算是十分优秀的两个.本文主要针对两者的常用功能做个简单的对比分析.在对比中了解二者的差异,同时帮助大家更好的掌握这两种预处理语言. 本文涉及到的sa ...

  4. css预处理器sass学习

    SASS 叫做css预处理器,他的基本思想是用一门专门的编程语言来进行页面样式的设计,然后在编译成正常的css文件. Sass的用法 安装 sass是用ruby语言写的,所以我们在安装sass之前要先 ...

  5. 前端CSS预处理器Sass

    前面的话   "CSS预处理器"(css preprocessor)的基本思想是,用一种专门的编程语言,进行网页样式设计,然后再编译成正常的CSS文件.SASS是一种CSS的开发工 ...

  6. css预处理器sass使用教程(多图预警)

    css预处理器赋予了css动态语言的特性,如变量.函数.运算.继承.嵌套等,有助于更好地组织管理样式文件,以及更高效地开发项目.css预处理器可以更方便的维护和管理css代码,让整个网页变得更加灵活可 ...

  7. 关于前端CSS预处理器Sass的小知识!

    前面的话   "CSS预处理器"(css preprocessor)的基本思想是,用一种专门的编程语言,进行网页样式设计,然后再编译成正常的CSS文件.SASS是一种CSS的开发工 ...

  8. CSS预处理器Sass、LESS 和 Stylus

    CSS 预处理器技术已经非常的成熟,而且也涌现出了越来越多的 CSS 的预处理器框架.本文向你介绍使用最为普遍的三款 CSS 预处理器框架,分别是 Sass.Less CSS.Stylus. 首先我们 ...

  9. CSS预处理器—Sass、LESS和Stylus

    http://www.w3cplus.com/css/css-preprocessor-sass-vs-less-stylus-2.html 一.什么是CSS预处器 CSS预处理器定义了一种新的语言, ...

随机推荐

  1. 动手实现自己的 STL 容器《2》---- list

    1. 序: 本文参考了侯捷的 <STL 源码分析>一书,出于兴趣,自行实现了简单的 list 容器. 学习了 STL 的 list 容器的源代码,确实能够提高写链表代码的能力.其中的 so ...

  2. supervisor安装配置与使用

    supervisor:C/S架构的进程控制系统,可使用户在类UNIX系统中监控.管理进程.常用于管理与某个用户或项目相关的进程. 组成部分supervisord:服务守护进程supervisorctl ...

  3. 第二个Sprint冲刺事后诸葛亮报告

    用户反馈:计时的填空题难度过大,计时选择题的画面太亮. 用户数量:4 团队改进建议:bug有点多 工作: 主界面 试卷题,是整合以前的内容的 选择题:也是整合以前功能的 初级的 计时题 1.每个成员第 ...

  4. .net解决数据导出excel时的格式问题

    在项目中一般都需要将报表数据导出到EXCEL中,但经常出现导出长串数据(如身份证)到EXCEL中后显示为科学计数法的格式,或者报表中显示为001的数据导出到Excel后成了1的格式. 下面简单介绍一下 ...

  5. Scalding初探之一:基于Scala的Hadoop利器

    把你从写繁琐的Map-reduce Job中解放出来,写分布式跟写本地程序没两样,Scala真真代表着先进生产力的方向啊. 好的,今天开始直播基于Scala的Scalding啦,循序渐进地看以下页面: ...

  6. Thrift 个人实战--初次体验Thrift

    前言: Thrift作为Facebook开源的RPC框架, 通过IDL中间语言, 并借助代码生成引擎生成各种主流语言的rpc框架服务端/客户端代码. 不过Thrift的实现, 简单使用离实际生产环境还 ...

  7. Thrift 个人实战--Thrift 的序列化机制

    前言: Thrift作为Facebook开源的RPC框架, 通过IDL中间语言, 并借助代码生成引擎生成各种主流语言的rpc框架服务端/客户端代码. 不过Thrift的实现, 简单使用离实际生产环境还 ...

  8. LeetCode 【47. Permutations II】

    Given a collection of numbers that might contain duplicates, return all possible unique permutations ...

  9. QTreeWidget创建

    QTreeWidget.顾名思义,这个类用来展示树型结构.同前面说的QListWidget类似,这个类需要同另外一个辅助类QTreeWidgetItem一同使用.不过,既然是提供方面的封装类,即便是看 ...

  10. centos-系统语言检查设置安装

    查看当前系统语言 登陆linux系统打开操作终端之后,输入 echo $LANG可以查看当前使用的系统语言. 查看安装的语言包 查看是否有中文语言包可以在终端输入 locale命令,如有zh cn 表 ...