Home  >  Article  >  Web Front-end  >  CSS conversion tool: PostCSS_html/css_WEB-ITnose

CSS conversion tool: PostCSS_html/css_WEB-ITnose

WBOY
WBOYOriginal
2016-06-24 11:39:591346browse

PostCSS is a tool to convert CSS using JS plugins, supporting variables, mixins, future CSS syntax, inline images and more.

PostCSS is already used by many big companies: Google, Twitter, Alibaba and Shopify. The Autoprefixer PostCSS plugin is one of the most popular CSS processor plugins.

PostCSS can be used as a preprocessor, similar to: Sass, Less and Stylus. But PostCSS is a modular tool that is 3-30 times faster and more powerful than its predecessors.

PostCSS includes a CSS parser, CSS node tree API, a source map generator and a node tree stringifier.

Code example:

:root {    --mainColor: #ffbbaaff;}@custom-media    --mobile (width <= 640px);@custom-selector --heading h1, h2, h3, h4, h5, h6;.post-article :--heading {    color: color( var(--mainColor) blackness(+20%) );}@media (--mobile) {    .post-article :--heading {        margin-top: 0;    }}

Project homepage: http://www.open-open.com/lib/view/home/1438092653706

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn