Google已经基于Apache License 2.0把Closure Stylesheets开源，这种工具属于Closure Tools包之内，在处理CSS的时候很有用。Closure Stylesheets是一个Java程序，它向CSS中添加了变量、函数、条件语句以及混合类型，使得我们更易于处理大型的CSS文件。开发者可以使用Google stylesheets （GSS）这种工具来生成web应用程序或者网站所使用的真正的CSS文件。
变量
变量是使用“@def”来定义的。下面的代码示例展示了如何使用变量：
@def BG_COLOR rgb（235, 239, 249）；@def DIALOG_BG_COLOR BG_COLOR;
body { background-color: BG_COLOR;}.dialog { background-color: DIALOG_BG_COLOR;}
得到的CSS如下：
body { background-color: #ebeff9;}.dialog { background-color: #ebeff9;}
函数
Closure Stylesheets引入了大量数学函数，使用它们你可以对数字型的值——比方说像素——进行以下操作： add（）、 sub（）、mult（）、 div（）、 min（）以及max（）。使用这些函数的示例如下：
@def LEFT_WIDTH 100px;@def LEFT_PADDING 5px;@def RIGHT_PADDING 5px;
.content { position: absolute; margin-left: add（LEFT_PADDING, LEFT_WIDTH, RIGHT_PADDING, px）；
得到的CSS如下所示：
.content { position: absolute; margin-left: 110px;}
条件语句
Closure Stylesheets让我们可以使用@if、@elseif和@else，广州达内从而基于某些变量的值来创建条件语句的分支。
混合类型
混合类型是为了重用带有参数的对结构体的声明，如下示例所示：
@defmixin size（WIDTH, HEIGHT） { width: WIDTH; height: HEIGHT;}.image { @mixin size（200px, 300px）；}
当解决跨浏览器的问题时，混合类型会更有用：
@defmixin gradient（POS, HSL1, HSL2, HSL3, COLOR, FALLBACK_COLOR） { background-color: FALLBACK_COLOR; /* fallback color if gradients are not supported */ background-image: -webkit-linear-gradient（POS, hsl（HSL1, HSL2, HSL3）， COLOR）； /* Chrome 10+,Safari 5.1+ */ /* @alternate */ background-image: -moz-linear-gradient（POS, hsl（HSL1, HSL2, HSL3）， COLOR）； /* FF3.6+ */ /* @alternate */ background-image: -ms-linear-gradient（POS, hsl（HSL1, HSL2, HSL3）， COLOR）； /* IE10 */ /* @alternate */ background-image: -o-linear-gradient（POS, hsl（HSL1, HSL2, HSL3）， COLOR）； /* Opera 11.10+ */}.header { @mixin gradient（top, 0%, 50%, 70%, #cc0000, #f07575）；}
结果如下：
.header { background-color: #f07575; background-image: -webkit-linear-gradient（top,hsl（0%,50%,70%） ,#cc0000）； background-image: -moz-linear-gradient（top,hsl（0%,50%,70%） ,#cc0000）； background-image: -ms-linear-gradient（top,hsl（0%,50%,70%） ,#cc0000）； background-image: -o-linear-gradient（top,hsl（0%,50%,70%） ,#cc0000）；}
我们还可以使用Closure Stylesheets把多个CSS文件合并成一个，以减少代码的规模，它会针对语法执行静态检查，并且知道如何交换左右两边的值（RTL flipping），以及如何对类进行重命名。
Closure Tools是一组工具，其中包括编译器、程序库和模板，它原本是Google为GMail、GDocs和Maps内部使用，后来在2009年开源。我们可以使用它来处理大型JavaScript应用程序。
转载于:https://www.cnblogs.com/javaitpx/archive/2012/12/17/2821693.html
发布者：全栈程序员-站长，转载请注明出处：https://javaforall.net/110252.html原文链接：https://javaforall.net
