postcss-plugin-pxtoem
v1.0.0
Published
A CSS post-processor that converts px to em.
Downloads
5
Maintainers
Readme
参照pxtorem将单位修改为em
Install
$ npm install postcss-plugin-pxtoem --save-dev
Input/Output
With the default settings, only font related properties are targeted.
// input
h1 {
margin: 0 0 20px;
font-size: 32px;
line-height: 1.2;
letter-spacing: 1px;
}
// output
h1 {
margin: 0 0 20px;
font-size: 2em;
line-height: 1.2;
letter-spacing: 0.0625em;
}
options
Type: Object | Null
Default:
{
rootValue: 16,
unitPrecision: 5,
propList: ['font', 'font-size', 'line-height', 'letter-spacing'],
selectorBlackList: [],
replace: true,
mediaQuery: false,
minPixelValue: 0,
exclude: /node_modules/i
}
A message about ignoring properties
Currently, the easiest way to have a single property ignored is to use a capital in the pixel unit declaration.
// `px` is converted to `em`
.convert {
font-size: 16px; // converted to 1em
}
// `Px` or `PX` is ignored by `postcss-pxtoem` but still accepted by browsers
.ignore {
border: 1Px solid; // ignored
border-width: 2PX; // ignored
}