美文网首页
正则表达式批量修改rem数值

正则表达式批量修改rem数值

作者: smaVivian | 来源:发表于2019-10-29 10:40 被阅读0次

打开控制台 souces -> snippets -> 新建snippets->保存->右键run->控制台得到结果

`
.com-footer .btn {
  display: inline-block;
  width:9.03rem;
  height:2.3rem;
  background:rgba(23,31,131,1);
  box-shadow:0rem 0.05rem 0.18rem 0rem rgba(51,103,188,0.28);
  border-radius:1.15rem;
  font-size:0.8rem;
  color:rgba(255,255,255,1);
  line-height:2.3rem;
}
`.replace(/\d+(\.\d+)?rem/, function(match){
    return parseFloat(match)+ 'px'
})
image.png
image.png
image.png

目的:1rem为20px的项目放到1rem为16px的项目中使用,需要批量修改rem数值

`
.com-footer .btn {
  display: inline-block;
  width:9.03rem;
  height:2.3rem;
  background:rgba(23,31,131,1);
  box-shadow:0rem 0.05rem 0.18rem 0rem rgba(51,103,188,0.28);
  border-radius:1.15rem;
  font-size:0.8rem;
  color:rgba(255,255,255,1);
  line-height:2.3rem;
}
`.replace(/\d+(\.\d+)?rem/g, function(match){
    return (parseFloat(match) * 1.25).toFixed(2) + 'rem'
})
image.png

相关文章

网友评论

      本文标题:正则表达式批量修改rem数值

      本文链接:https://www.haomeiwen.com/subject/bsswvctx.html