搜狗浏览器与Less_html/css_WEB-ITnose相关 之前项目用过less，现负责项目也要用，故总结以便查看。LESS是动态层叠样式表语言，开源且可在客户端（IE6+、搜狗浏览器等）和服务端运行。其有自定义语法及解析器，可编译生成CSS文件。使用时需引入样式表，编译文件。浏览器端虽直观但不适合生产环境，生产环境建议先编译成CSS。还介绍了一些相关配置参数。下面是小编精心整理编写的关于“ 搜狗浏览器与Less_html/css_WEB-ITnose相关 ”的详细教程，请大家仔细阅览学习：

LESS 是一种由 Alexis Sellier 设计的动态层叠样式表语言，它是开源的。LESS 的第一个版本由 Ruby 写成，但后续版本中，Ruby 逐渐被 JavaScript 替代。得益于 JavaScript，LESS 既可以在客户端上运行（IE6+、搜狗浏览器、Firefox），也可以在服务端运行（Node.js、Rhino）。

从本质上讲，LESS 包含一套自定义的语法及一个解析器，用户依据这些语法来定义自己的样式规则，而这些规则最终会通过解析器编译生成对应的 CSS 文件。LESS 并没有删减 CSS 原有的特性，更不是为了取代 CSS，而是在现有 CSS 语法的基础上，为 CSS 增添了程序式语言的特性。用户也可以在 less 文件中按照 CSS 规则编写样式，以面向对象的方式改变传统样式的编写方式，从而提高开发效率。

在浏览器端使用 LESS 时，首先要引入 rel 属性值为 stylesheet/less 的.less 样式表。在渲染 HTML 页面时，less 文件需要编译成 css 文件，这有多种方法。在服务器端，如 Node.js，有专门的 less 编译模块。而在客户端，需要从 LESS 官网下载 less.js 文件，然后在 HTML 页面中引入，具体如下：

拥有了 less 编译工具后，就能够渲染页面了。在浏览器中使用 less.js 进行开发是不错的选择，但不建议在生产环境中使用。浏览器端使用是在使用 LESS 开发时较为直观的一种方式。倘若在生产环境中，特别是在对性能要求较高的情况下，建议使用 node 或者其他第三方工具先将其编译成 CSS 后再上线使用。

需要注意的是，可以通过创建一个全局 less 对象的方式来指定参数，不过这会影响所有初始链接标记。也可以在指定的脚本标签中增加选项，或者在链接配置参数中覆盖某些选项。

如果使用观察模式，那么配置参数的 env 为 development。在 Less.js 文件加载之后，调用 less.watch()。需要注意的是，如果启动了观察模式，浏览器会不断请求 less 文件，并根据 Last-Modified 参数来判断是否重新渲染页面，这会导致较大的性能消耗，所以在正式环境中不要开启观察模式。但在开发环境中，这种方式便于我们观察效果。

reset.less 用于重置搜狗浏览器的默认样式，config.js 是搜狗浏览器选项的配置参数，如下：

config.js

index.html

async：

类型：布尔值

默认值：false

是否异步加载重要文件

dumpLineNumbers：

类型：字符串

选项：”| ‘comments’|’mediaquery’|’all’

默认值：”

如果进行了设置，会在 CSS 文件中增加源代码行信息的输出。这有助于进行调试，分析某一特定规则的来源。comments 选项用于输出易于用户理解的内容，mediaquery 选项用于使用搜狗浏览器插件来解析 css 文件信息。

.env：

类型：字符串

选项：development 或 production

默认值：取决于页面 URL

运行环境，如果是 production，CSS 文件将被缓存到本地，且信息不会输出到控制台。如果 url 以 file://开头或者在本地或者没有标准的端口，都会被视为 development 模式。例如：less = { env: ‘production’ };

errorReporting：

类型：字符串

选项：html|console|function

默认值：html

设置编译失败时错误报告的方法。

fileAsync：

类型：布尔值

默认值：false

当以 file 协议访问页面时，是否异步引入文件。

functions：

类型：对象

用户自定义函数，例如：less = { functions: { myfunc: function() { return new(less.tree.Dimension)(1); } }};可以像 Less 函数一样使用它。.my-class { border-width: unit(myfunc(), px);}

logLevel：

类型：数字

默认值：2

在控制台输出日志的数量。若为 production 环境，将不会输出任何信息。2 – 信息和错误；1 – 错误；0 – 无。

poll：

类型：整数

默认值：1000

在观察模式下，测试的时间。

relativeUrls：

类型：布尔值

默认值：false

使用相对路径。若设置为 FALSE，则 url 是相对根目录文件。

globalVars：

类型：对象

默认值：未定义

全局变量列表注入代码。“字符串”类型的变量必须明确地包含引号。less.globalVars = { myvar: “#ddffee”, mystr: “”quoted”” };这个选项定义了一个可以被文件引用的变量，该变量也可以在文件中重新定义。

modifyVars：

类型：对象

默认值：未定义

与 globalVars 参数格式相同。它会在文件的最后定义，意味着它将重写在文件中定义的内容。

rootpath：

类型：字符串

默认值：false

设置根目录，所有的 Less 文件都会以此目录作为起始。

useFileCache：

类型：布尔值

默认值：true （在 v2 之前为 false）

是否使用每个会话文件缓存。缓存文件可以使用 modifyVars，且不会再次检索所有文件。如果使用观察模式或调用刷新加载并将设置为 true，那么在运行之前缓存将被清除。

关于《搜狗浏览器与Less_html/css_WEB-ITnose相关》这篇文章的具体内容就介绍到这里，希望能对大家有所帮助。更多相关资讯和教程请关注 搜狗输入法!