• px to rem & rpx & vw中文文档 |px自动转换rem插件


    【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 文件优先级最高,

    其格式如下:

    1. {
    2. "rootFontSize": 18,
    3. "fixedDigits": 3
    4. }

    其次,也可以配置全局,点击 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

  • 相关阅读:
    创建多个 conda 环境和 jupyter 切换使用环境
    HTML的实体符号
    练习题57:接口的语法特征
    【AUTOSAR】【以太网】SomeIpXf
    大模型相关技术了解
    技术干货|什么是大模型?超大模型?Foundation Model?
    gofs使用教程-基于golang的开源跨平台文件同步工具
    OpenGL基础教程
    Synchronized锁升级原理与过程深入剖析
    074:vue+openlayers通过拖拽,旋转放缩地图(示例代码)
  • 原文地址:https://blog.csdn.net/cplvfx/article/details/132976915