px to rem & rpx & vw中文文档 |px自动转换rem插件|css|字体大小尺寸转换

【px to rem & rpx & vw】项目地址:

https://github.com/cipchk/vscode-cssrem/blob/HEAD/README.zh-CN.md

作者:卡色-cipchk

https://github.com/cipchk

 cssrem

一个 px 与 rem 单位互转的 VSCode 插件,且支持WXSS微信小程序。

特性

  • 支持智能感知
    • px -> rem (快捷键:Alt + z)
    • rem -> px (快捷键:Alt + z)
    • px -> vw (快捷键:Alt + v, Alt + w)
    • vw -> px (快捷键:Alt + v, Alt + w)
    • px -> rpx (微信小程序, 快捷键:Alt + r)
    • rpx -> px (微信小程序, 快捷键:Alt + r)
  • 支持鼠标悬停显示转化过程
  • 支持直接打上标记
  • 支持选中区域

可以利用VSCODEKeyboard shortcuts重新定义快捷键。

如何使用

  • 在文件内自动转换,例如录入 12px 智能提醒对应转化后 rem 值
  • 光标至 14px 上,按下 Alt + z 对应转化 rem
  • 通过 F1 面板查找:cssrem

支持语言

html vue css less scss sass stylus tpl(php smarty3) tsx jsx

配置

【重要的话说三遍】

根目录的 .cssrem 文件优先级最高,

根目录的 .cssrem 文件优先级最高,

根目录的 .cssrem 文件优先级最高,

其格式如下:

{
  "rootFontSize": 18,
  "fixedDigits": 3
}

其次,也可以配置全局,点击 VS Code 的 文件 > 首选项 > 设置,打开设置面板:

名称描述默认值
cssrem.rootFontSize基准font-size(单位:px16
cssrem.fixedDigits保留小数点最大长度4
cssrem.autoRemovePrefixZero自动移除0开头的前缀true
cssrem.ingoresViaCommand当使用命令行批量转换时,允许忽略部分 px 值不转换成 rem(单位:string[]),例如:[ "1px", "0.5px" ][]
cssrem.addMark是否启用加上标记false
cssrem.hover是否启用悬停时显示转换数据, disabled: Disabled, always Anything, onlyMark: Only valid when cssrem.addMark is trueonlyMark
cssrem.currentLine是否当前行尾显示标记,disabled: Disabled, show Showshow
cssrem.ingores忽略文件清单,例如:[ 'demo.less', 'src' ]string[]
cssrem.languages支持语言清单 [ 'html', 'vue', 'css', 'postcss', 'less', 'scss', 'sass', 'stylus', 'javascriptreact', 'typescriptreact', 'javascript', 'typescript' ],默认全部包含string[]
cssrem.remHover是否启用 rem 悬停true
cssrem.vw是否启用vw支持false
cssrem.vwHover是否启用 vw 悬停true
cssrem.vwDesign规定设计稿宽度(一般等同于浏览器视口宽度)750
cssrem.wxssWXSS小程序样式 是否启用WXSS支持false
cssrem.wxssScreenWidthWXSS小程序样式 规定屏幕宽度,默认 750尺寸单位750
cssrem.wxssDeviceWidthWXSS小程序样式 设备分辨率宽度,官方推荐使用 iPhone6 作为视觉稿的标准375

  • 1
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

橙-极纪元JJY.Cheng

客官,1分钱也是爱,给个赏钱吧

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值