1.postcss

PostCSS 的主要功能只有两个:第一个就是前面提到的把 CSS 解析成 JavaScript 可以操作的 抽象语法树结构(Abstract Syntax Tree,AST),第二个就是调用插件来处理 AST 并得到结果。

PostCSS 一般不单独使用,而是与已有的构建工具进行集成。PostCSS 与主流的构建工具,如 Webpack完成集成之后,选择满足功能需求的 PostCSS 插件并进行配置。

2.CSS 是一门非程序式语言,没有变量、函数、SCOPE(作用域),需要书写大量看似没有逻辑的代码,不方便维护及扩 展,不利于复用,尤其对于非前端开发工程师来讲,往往会因为缺少 CSS 编写经验而很难写出组织良好且易于维护的 CSS 代码。为了方便前端开发的工作量,出现了sass和less.

3.Sass已经有了两套语法规则 一个是Sass,一个是SCSS,SCSS语法为主流 使用ruby语言编写
4.less 2009年开源的一个项目,受Sass的影响较大,但又使用CSS的语法,让大部分开发者和设计师更容易上手。LESS提供了 多种方式能平滑的将写好的代码转化成标准的CSS代码。使用JavaScript编译器进行编译

对postcss以及less和sass的研究的更多相关文章

  1. PostCSS深入学习: PostCSS和Sass、Stylus或LESS一起使用

    如果你喜欢使用PostCSS,但又不想抛弃你最喜欢的预处理器.不用担心,你不需要作出二选一的选择,你可以把PostCSS和预处理器(Sass.Stylus或LESS)结合起来使用. 有几个PostCS ...

  2. 在 CSS 预编译器之后:PostCSS

    提到css预编译器(css preprocessor),你可能想到Sass.Less以及Stylus.而本文要介绍的PostCSS,正是一个这样的工具:css预编译器可以做到的事,它同样可以做到. “ ...

  3. webstorm下设置sass

    关于sass,就不想多说什么了.只要你有css基础,十分钟入门好吗.可以参考下资料:http://www.w3cplus.com/sassguide/ 今天想说的是webStorm下如何实现sass自 ...

  4. PostCSS以及cssnext语法

    什么是postcss postcss 一种对css编译的工具,类似babel对js的处理,常见的功能如: 1 . 使用下一代css语法 2 . 自动补全浏览器前缀 3 . 自动把px代为转换成 rem ...

  5. [翻译]纠正PostCSS的4大认识误区

    市面上已经有很多的前端工具,再来引入新的前端工具,价值大不大?这主要取决于,它是否给开发人员提供了新的功能,是否值得花时间和精力去学习和使用? PostCSS出现时有一个很有趣的现象.像sass和le ...

  6. 【项目实战】sass使用基础篇(上)

    Sass是一种CSS预处理语言.CSS预处理语言是一种新的专门的编程语言,编译后形成正常的css文件,为css增加一些编程特性,无需考虑浏览器的兼容性(完全兼容css3),让css更加简洁.适应性更强 ...

  7. boi剖析 - 基于webpack的css sprites实现方案

    本文是58到家前端工程化集成解决方案boi的博文系列之一.boi是基于webpack打造的一站式前端工程化解决方案,现已开源Github. 作为前端构建工具不可或缺的一个环节,自动生成css spri ...

  8. 关于使用vw单位适配H5项目(二)

    一些比较小的H5页面,我觉得全没有必要一定要使用框架的,比如vue和react之类的,我觉得原生的js,html5也可以写好移动端. 最近刚好要赶10多个h5页面,适配移动端的,各种手机型号都要适配, ...

  9. 如何在VUE项目中使用SCSS

    首先要了解什么是CSS 预处理器? SCSS是一种CSS预处理语言 定义了一种新的专门的编程语言,编译后形成正常的css文件,为css增加一些编程特性,无需考虑浏览器的兼容性(完全兼容css3),让c ...

随机推荐

  1. RobotFramework 用例出错后继续操作

    出错后退出 在默认情况下,当一个测试用例中的某个关键字返回错误时,这个测试用例就停止执行剩余的关键字.RF会继续执行下一个用例.这么做的好处是节省时间--反正这里出问题要返回来看了,再继续执行剩下的关 ...

  2. TField中的GetText和SetText

    在数据表中的某些字段出于性能或数据规范化的考虑,会用组编号代替,就像学生有学号,员工有员工ID一样,但我们看的时候如果直接输入这样的编号看的人可能就会头痛了,这时就可用TField中的GetText转 ...

  3. node-webkit-updater——NW.js自动更新

    NW.js自动更新三种方案: 1)node-webkit-updater(推荐) 2)nwjs-autoupdater 3)nw-autoupdater NW.js自动更新三种方案:[http://d ...

  4. 【Linux开发】【Qt开发】配置tslibs触摸屏库环境设置调试对应的设备挂载点

    [Linux开发][Qt开发]配置tslibs触摸屏库环境设置调试对应的设备挂载点 标签(空格分隔): [Linux开发] [Qt开发] 比如: cat /dev/input/mice cat /de ...

  5. Canvas入门01-基础知识

    定义一个canvas,直接在Html中使用canvas便签即可. <!DOCTYPE html> <html lang="en"> <head> ...

  6. 11g Oracle Rac安装(基于linux6)

    安装 Oracle 11gR2 RAC on Linux 6 本文介绍如何在Oracle Linux 6上安装2节点Oracle 11gR2 Real Application Cluster(RAC) ...

  7. 分享一个linux系统中循环遍历两个数组内容,并输出数组中的不同内容的shell脚本

    cat diffarray.sh #!/bin/bash arry_list1=(1 2 3 4 5 6 7 8 9) arry_list2=(3 5 8) declare -a diff_list ...

  8. Charles的app抓包配置和抓包节点为unknown、乱码、手机无法上网等问题的处理

    关于手机端抓包配置Charles的一些配置,并且解决,请求存在unknown和内容为乱码的问题 关于请求节点为unknown.内容为乱码和手机端无法访问网络其实都是手机端证书配置问题导致,有的配置后还 ...

  9. 【6.10校内test】T3 加分二叉树

    加分二叉树[题目链接] 感觉我超废 这道题当时压根就不会qwq(我倒是挺适合写rand的qwq) 对于暴力的做法: 输入数据,定义数组men[i][i]=v[i](输入的第二行): dfs: dfs ...

  10. electron实现qq快捷登录!

    之前本来想不写这个功能的,结果客户死活要qq登录! 实在没办法就写了,顺便写个文章!在写之前有两个问题:1: 打开qq授权页面点击页面中的链接会又打开一个页面! .....2: 授权之后是否成功很难去 ...