CSS 预处理器技术已经非常的成熟,而且也涌现出了越来越多的 CSS 的预处理器框架.本文向你介绍使用最为普遍的三款 CSS 预处理器框架,分别是 Sass.Less CSS.Stylus. 首先我们来简单介绍下什么是 CSS 预处理器,CSS 预处理器是一种语言用来为 CSS 增加一些编程的的特性,无需考虑浏览器的兼容性问题,例如你可以在 CSS 中使用变量.简单的程序逻辑.函数等等在编程语言中的一些基本技巧,可以让你的 CSS 更见简洁,适应性更强,代码更直观等诸多好处. 不要再停留在石器时…

由于没有办法在网络上找到适合顾客的模板,同时之前自己写css也没有很好的管理方式,最终选择了scss. Nested #main p { color: #00ff00; width: 97%; .redbox { background-color: #ff0000; color: #000000; } } >>>>>>>>>>>>>>>>>>>> #main p { color: #00…

Copy/pasting the same code is redundant and updating copy/pasted code slows development velocity. Mixins are reusable chunks of code that are included, similar to calling a function, instead of copy/pasted. Mixins have some nice features:- Arguments…

一直以来非常庆幸曾经有翻过<代码大全2>:这使我崎岖编程之路少了很多不必要的坎坷.它在软件工艺的话题中有写到一篇:"首先是为人写程序,其次才是机器(Write Programs for People First, Computers Second)".虽然这是针对代码可读性来谈及的,但这间接昭示了开发效率之重要不是?此次以 Vue , Es6, Jade, Scss , Webpack, Gulp等一套强大组合来改善团队前端工作流,首因即出于这个理念. 微注:如此处排版不尽…

Ruby安装Scss 引言 已经许久不写HTML了,今天有点以前的东西要改.但是刚装的Windows10,已经没有以前的Web开发环境了.只好重新安装. 结果Webstorm装好后配置Scss出现错误. Ruby官网和淘宝镜像均连接不上,我用的也是https.但是试了不知道多少次才安装成一次.(万恶的墙) 尝试把原来安装后的scss相关的文本拷贝进去(当初就知道有连接不上这么一天), 还是不行. 最后只有自己去GitHub上下Scss的源码 Tips 本文默认读者已经正确安装Ruby 使用Scs…

CSS预处理器:less和sass:CSS 预处理器是一种语言用来为 CSS 增加一些编程的的特性,无需考虑浏览器的兼容性问题,例如你可以在 CSS 中使用 变量.简单的程序逻辑.函数等等在编程语言中的一些基本技巧,可以让你的 CSS 更 见简洁,适应性更强,代码更直观等诸多好处. less框架的应用:less一门标记性语言,HTML文件还是链接生成的css文件注释:单行注释://编译后不会出现在同名的css文件中多行注释:/* */编译后会出现在同名的css文件中 1.新建less文件2.在编…

一. Sass/Scss.Less是什么? Sass (Syntactically Awesome Stylesheets)是一种动态样式语言,Sass语法属于缩排语法,比css比多出好些功能(如变量.嵌套.运算,混入(Mixin).继承.颜色处理,函数等),更容易阅读. Sass与Scss是什么关系? Sass的缩排语法,对于写惯css前端的web开发者来说很不直观,也不能将css代码加入到Sass里面,因此sass语法进行了改良,Sass 3就变成了Scss(sassy css).与原来的语…

原文出处:Understanding Optionals in Swift 苹果新的Swift编程语言带来了一些新的技巧,能使软件开发比以往更方便.更安全.然而,一个很有力的特性Optional,在你第一次使用时可能会感到困惑.Optionals将会在编译阶段检查哪些值为nil.通过这种方式,你可以更好的保证应用程序交付在用户手里是可运行的.在Swift中,Optionals也提供了一些接口用来和遗留的Objective-C代码之间交互. 初试Optional 让我们在XCode中新建一个叫做s…

Atitit. null错误的设计 使用Optional来处理null 然后,我们再看看null还会引入什么问题. 看看下面这个代码: String address = person.getCountry().getProvince().getCity(); 如果你玩过一些函数式语言(Haskell.Erlang.Clojure.Scala等等),上面这样是一种很自然的写法.用Java当然也可以实现上面这样的编写方式. 但是为了完满的处理所有可能出现的null异常,我们不得不把这种优雅的函数编程…

css加载器文件通常和extract-text-webpack-plugin一块使用,我们可以在源文件src目录下写scss文件,然后通过webpack编译成css文件到输出目录public,这个目录就是我们网站需要引用的目录. var webpack = require('webpack'); var HtmlWebpackPlugin = require('html-webpack-plugin'); var ExtractTextWebpackPlugin = require('extra…

关于Autoprefixer Autoprefixer是一个后处理程序,不象Sass以及Stylus之类的预处理器.它适用于普通的CSS,可以实现css3代码自动补全.也可以轻松跟Sass,LESS及Stylus集成,在CSS编译前或编译后运行.详情见,https://github.com/postcss/autoprefixer 当Autoprefixer添加前缀到你的CSS,还不会忘记修复语法差异.这种方式,CSS是基于最新W3C规范产生: 使用方法: step1:安装node.js ste…

转自:http://www.cnblogs.com/peida/archive/2013/06/14/Guava_Optional.html 参考:[Google Guava] 1.1-使用和避免null 在我们学习和使用Guava的Optional之前,我们需要来了解一下Java中null.因为,只有我们深入的了解了null的相关知识,我们才能更加深入体会领悟到Guava的Optional设计和使用上的优雅和简单.  null代表不确定的对象: Java中,null是一个关键字,用来标识一个不…

第一种方法(ruby方法) 先安装ruby,在windows/system32目录下 1.先查询源是什么 gem sources 2.移除原有的源头 gem sources -r http://xxxxx; 3.添加腾讯云地址 gem sources -a http://gems.ruby-china.org/; 4.在此目录下安装sass,   gem install sass 5.在安装ruby的目录下找到scss.bat文件配置到webstorm tool下 第二种方法(node-sass…

SASS?SASS是一种CSS的开发工具,提供了许多便利的写法,大大节省了设计者的时间,使得CSS的开发,变得简单和可维护. sass有两种后缀名文件: sass(不使用大括号和分号)---不建议使用 scss(使用大括号和分号)----普遍使用 导入: @import "reset.css"; sass有两种注释方式: 标准的css注释方式 //双斜杆形式的单行注释(单行注释不会被转译出来.) SASS提供四个编译风格的选项: * nested:嵌套缩进的css代码,它是默认值. *…

CSS 预处理器定义了一种新的语言,其基本思想是,用一种专门的编程语言,为 CSS 增加了一些编程的特性,将 CSS 作为目标生成文件,然后开发者就只要使用这种语言进行编码工作. 通俗的说,“CSS 预处理器用一种专门的编程语言,进行 Web 页面样式设计,然后再编译成正常的 CSS 文件,以供项目使用.CSS 预处理器为 CSS 增加一些编程的特性,无需考虑浏览器的兼容性问题”,例如你可以在 CSS 中使用变量.简单的逻辑程序.函数(如右侧代码编辑器中就使用了变量$color)等等在编程语言中…

SCSS语法: 假设变量申明带有!default,那么如果在此申明之前没有这个变量的申明,则用这个值,反之如果之前有申明,则用申明的值. ‘...’传递多个参数: @mixin box-shadow($shadow...){ -webkit-box-shadow:$shadow; -moz-box-shadow:$shadow; box-shadow:$shadow; } 用在属性或者选择器上,就得以#{}包裹 多个变量值一起申明: $linkColor: red blue !default;…

过多的使用null可能会导致大量的bugs,Google code 底层代码中,95%的集合类默认不接受null值.对null值,使用快速失败拒绝null比默认接受更好. 另外,null本身的含义很模糊.例如,对于null返回值,如Map.get(key)返回null,可能因为和key对应的值为null,也可能map中根本没有该key.null也可以用以表示失败或成功,可能代表任何事物.使用其他值而不是null可以使代码含义表达的更清楚. 尽管如此,有些地方还是应该使用null.在内存和速度方面…

1.  上一节我们学习了Windows下搭建Ruby开发环境,也为这一节的学习做了铺垫.因为本节需要在Ruby环境下安装SASS.详细请见:http://www.cnblogs.com/wind128/p/4226058.html. 2.  安装SASS,运行cmd命令,输入: gem install sass 安装成功后打开目录C:\Ruby21-x64\bin,可见sass.bat.scss.bat文件. 3.  打开WebStorm,点File-->Settings,找到File Watc…

如标题所述,这篇博文是说scss以及gulp发布方式: 如果你没用过scss和gulp或不甚了解,你可以看看这篇博文,叙说的水平有限,各位看官大神见谅: 说scss之前,先来说说sass,sass是一种CSS的开发工具(前面的scss和less都是),提供了许多便利的写法,大大节省了设计者的时间,使得CSS的开发,变得简单和可维护:我们都知道css不是一种编程语言,它只能定义描述样式,无法像编程语言一样继承和编译,而sass给我们提供这样一种便利,或者说它就是这样设计诞生的,sass中可以写入变…

//html <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>满天星</title> <link rel="stylesheet" type="text/css" href="css/star.css"/> </head> <body> <di…

什么是Optional对象 Java 8中所谓的Optional对象,即一个容器对象,该对象可以包含一个null或非null值.如果该值不为null,则调用isPresent()方法将返回true,且调用get()方法会返回该值. 另外,该对象还有其它方法: 如可以使用orElse()方法给Optional对象设定默认值(当值为null时,会使用默认值): 使用ifPresent()方法来执行一段代码(当值不为null时,执行代码段). Optional主要被用于Java 8的Stream中,简…

第一种方案:在scss文件第一行加上这行代码@charset "utf-8"; 第二种方案: scss文件编译时候使用ruby环境,出现 Syntax error: Invalid GBK character "\xE5" 检查了好久才发现 scss编译不支持中文字体,请教了下度娘才找到解决方案 解决方法很简单 进入到Koala 安装目录 D:\Koala\rubygems\gems\sass-3.4.9\lib\sass修改 engine.rb 文件 在requi…

我们知道,maven的依赖关系是有传递性的.如:A-->B,B-->C.但有时候,项目A可能不是必需依赖C,因此需要在项目A中排除对A的依赖.在maven的依赖管理中,有两种方式可以对依赖关系进行,分别是可选依赖(Optional Dependencies)以及依赖排除(Dependency Exclusions). 一.可选依赖 当一个项目A依赖另一个项目B时,项目A可能很少一部分功能用到了项目B,此时就可以在A中配置对B的可选依赖.举例来说,一个类似hibernate的项目,它支持对mys…

身为一名Java程序员,大家可能都有这样的经历:调用一个方法得到了返回值却不能直接将返回值作为参数去调用别的方法.我们首先要判断这个返回值是否为null,只有在非空的前提下才能将其作为其他方法的参数.这正是一些类似Guava的外部API试图解决的问题.一些JVM编程语言比如Scala.Ceylon等已经将对在核心API中解决了这个问题.在我的前一篇文章中,介绍了Scala是如何解决了这个问题. 新版本的Java,比如Java 8引入了一个新的Optional类.Optional类的Javadoc…

webstorm支持sass的同步编译,也就是即写即编译,并且可以指定编译后的css的目录. 本文使用的webstorm为8.0版本 scss安装:http://www.w3cplus.com/sassguide/install.html 打开webstorm: 点击左上角的File→Settings→File Watchers 在弹窗的窗口的右上角点击绿色的 ‘+’ 号,然后选择scss -----------------------------------------------------…

我们在swift的开发中会经常遇见?和! ,理解这两个符号深层次的内容对我们的开发是相当有利的: 目前网上对swift3.0的教程还相当的少,如果去搜索会发现早期的说法,在定义变量的时候,swift是不会给变量赋值初始值的,所以当你声明一个字符串变量的时候,var string:String   就会被系统报错,但是目前的swift版本却不报错了. 但是你要给一个字符串赋值未nil的时候,var string:String = nil 就一定是错误的   因为nil并不是一个字符串类型,而实际上…

1.安装rvm 先安装 [Xcode](http://developer.apple.com/xcode/) 开发工具,它将帮你安装好 Unix 环境需要的开发包 sudo curl -L https://get.rvm.io | bash -s stable sudo source ~/.rvm/scripts/rvm rvm -v 2.用rvm安装ruby sudo rvm install ruby--p648 gem -v gem source -r https://rubygems.or…

本篇分三部分: 一.Struct Mutable方法 二.多元组(Tuple) 的使用 三.autoclosure 的使用 四.Optional Chain 的使用 一.Struct Mutable方法 直接上代码: struct User { var weight: Int var height: Int // 这里会报错 Left side of mutating operator isn't mutable:'self' is immutable // 因为 Struct 出来的变量是 i…

_mixin scss包括常用的mixin,%及@functionmixin,通过@include调用,样式通过拷贝的方式使用,尤其适用于传递参数%,通过@extend调用,样式通过组合申明的方式使用,适用于不传参数的代码片段 @function,返回一个值,用于调用----------------------------------------------------- mixin & %既定义了mixin也定义了%,根据需求使用@include或@extend调用 // inline-blo…

if let buttonBeep = self.setupAudioPlayerWithFile("ButtonTap", type: "wav") {                        self.buttonBeep = buttonBeep        }        if let secondBeep = self.setupAudioPlayerWithFile("SecondBeep", type: "wav…