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

CSS conversion tool: PostCSS_html/css_WEB-ITnose

WBOY
Release: 2016-06-24 11:39:59
Original
1384 people have browsed it

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;    }}
Copy after login

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

Related labels:
source:php.cn
Statement of this Website
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
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template