PostCSS 是个什么鬼东西

html-css021

PostCSS 是个什么鬼东西,第1张

PostCSS 是使用 JS 插件来转换 CSS 的工具,支持变量,混入,未来 CSS 语法,内联图像等等。

PostCSS 已经被许多大公司使用:谷歌,推特,阿里巴巴和 Shopify。 Autoprefixer PostCSS 插件是最流行的 CSS 处理器插件之一。

PostCSS 可以作为预处理器使用,类似:Sass, Less 和 Stylus。但是 PostCSS 是模块化的工具,比之前那些快3-30 倍,而且功能更强大。

PostCSS 包括 CSS 解析器,CSS 节点树 API,一个源映射生成器和一个节点树 stringifier。

简而言之,PostCSS是CSS变成JavaScript的数据,使它变成可操作。PostCSS是基于JavaScript插件,然后执行代码操作。PostCSS自身并不会改变CSS,它只是一种插件,为执行任何的转变铺平道路。

本质上是没有很制PostCSS插件操纵CSS,也就是说它可以适用于任何CSS。只要你能想到的,你都可以编写一个PostCSS插件,让它来转成CSS。

PostCSS插件可以像预处理器,它们可以优化和autoprefix代码;可以添加未来语法;可以添加变量和逻辑;可以提供完整的网格系统;可以提供编码的快捷方式......还有很多很多。

事实上,使用PostCSS插件你可以做任何你想做的任何事情,但PostCSS相对而言还是较新,这也导致了一些误解,工具实际上是什么。

许多人(包括我自己在内)对PostCSS没有一个完整的印象,PostCSS实际是什么,并因此错过了PostCSS可以提供什么。

1. 标签名选择器 div { color:Red} 即页面中的各个标签名的css样式

2.类选择器 .divClass {color:Red} 即定义的每个标签的class 中的css样式

3.ID选择器 #myDiv {color:Red}即页面中的标签的id

4.后代选择器(类选择器的后代选择器) .divClass span { color:Red} 即多个选择器以逗号的格式分隔 命名找到准确的标签

5.群组选择器 div,span,img {color:Red}即具有相同样式的标签分组显示

SASS平台是一种CSS的开发工具,提供了许多便利的写法,大大节省了设计者的时间,使得CSS的开发,变得简单和可维护。SASS是Ruby语言写的,但是两者的语法没有关系,里面可以直接使用CSS语法,文件后缀名是.scss。

CSS层叠样式表是一种用来表现HTML或XML等文件样式的计算机语言。CSS不仅可以静态地修饰网页,还可以配合各种脚本语言动态地对网页各元素进行格式化。CSS 能够对网页中元素位置的排版进行像素级精确控制,支持几乎所有的字体字号样式,拥有对网页对象和模型样式编辑的能力。

易于使用和修改

CSS可以将样式定义在HTML元素的style属性中,也可以将其定义在HTML文档的header部分,也可以将样式声明在一个专门的CSS文件中,以供HTML页面引用。总之,CSS样式表可以将所有的样式声明统一存放,进行统一管理。

另外,可以将相同样式的元素进行归类,使用同一个样式进行定义,也可以将某个样式应用到所有同名的HTML标签中,也可以将一个CSS样式指定到某个页面元素中。如果要修改样式,我们只需要在样式列表中找到相应的样式声明进行修改。

以上内容参考  百度百科-CSS