好用的px转rem插件推荐

Clect 发布于2019-08-30 14:20 / 1258人阅读

摘要：然而在固定布局时我们通常以为基准单位进行调整，进而通过计算获取的值，这时如果有个好用的转工具会让工作事半功倍。启用此插件的文件类型。输入值后按下键直接转换，使用取消转换

在响应式布局中，rem这个css单位已经慢慢崭露头角，成为最佳解决方案之一。然而在固定布局时我们通常以px为基准单位进行调整，进而通过计算获取rem的值，这时如果有个好用的px转rem工具会让工作事半功倍。本文将推荐一些常用开发工具的px转rem插件

VSCode插件 1、cssrem

安装

快捷键ctrl+p打开转到文件搜索框，输入命令：ext install cssrem

配置

参数配置文件：VSCode -> 文件 -> 设置 -> 搜索cssrem

cssrem.rootFontSize root font-size (unit: px), default: 16

cssrem.fixedDigits px转rem小数点最大长度，默认：6。

cssrem.autoRemovePrefixZero 自动移除0开头的前缀，默认：true

该插件可以在输入时选择转换，也可以使用ctrl+p，ctrl+r快捷键转换，支持html vue css less scss sass等文件格式或自定义文件

2、px to rem 安装

快捷键ctrl+p打开转到文件搜索框，输入命令：ext install px-to-rem

配置

参数配置文件：VSCode -> 文件 -> 设置 -> 搜索px to rem

px-to-rem.px-per-rem: number of pixels per rem. Default is 16px.

px-to-rem.number-of-decimals-digits: 最多保留的小数位

px-to-rem.only-change-first-ocurrence: 转换全部或只转换当前选择的

px-to-rem.notify-if-no-changes: 启用/关闭通知

选中要转换的值，使用快捷键Alt+z执行px转rem或rem转px

Sublime Text插件 1、cssrem插件

安装

下载本项目，比如：git clone https://github.com/flashlizi/cssrem
进入packages目录：Sublime Text -> Preferences -> Browse Packages...
复制下载的cssrem目录到刚才的packges目录里。
重启Sublime Text。

配置

参数配置文件：Sublime Text -> Preferences -> Package Settings -> cssrem

px_to_rem - px转rem的单位比例，默认为40。

max_rem_fraction_length - px转rem的小数部分的最大长度。默认为6。

available_file_types - 启用此插件的文件类型。默认为：[".css", ".less", ".sass"]。

输入px值后按下Enter键直接转换，使用Ctrl+z取消转换

GPU云服务器云服务器 px2rem 好用的vps推荐好用的视频转码软件哪里有好用的云服务器推荐

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/115944.html

PostCSS真的太好用了！

摘要：下面的代码违反规则下面的代码符合规则禁止使用十六进制颜色十六进制的颜色违反规则无效的十六进制色同样违规下面的是符合规则的自动将十六进制色转换为大写或者小写可以使用实现同样的功能。 showImg(https://segmentfault.com/img/remote/1460000014782565); 在PostCSS官网有着这样的对PostCSS特性介绍，箭头后面是对应功能的插件及...

SKYZACK 2019-08-29 15:18 评论0 收藏0
vw+rem移动端自适应布局

摘要：本文同步发布于我的个人博客上移动端自适应布局不管是面试还是工作过程中，移动端的布局都比较常见，而移动端适配方法也是多种多样。表示当前视口宽度的百分之一。同时在移动端，的兼容性还不错，完全可以直接使用。这样完成了一个简单好用的移动端布局了本文同步发布于我的个人博客上 - vw+rem移动端自适应布局不管是面试还是工作过程中，移动端的布局都比较常见，而移动端适配方法也是多种多样。一般来...

Little_XM 2019-08-30 11:09 评论0 收藏0
使用vue开发移动端管理后台

摘要：独立完成一个移动端项目不是很明白为何会有这样的商品管理后台，还是有些经验不足，包括对产品的全局思考，对插件的选择等，都有考虑不周的缺点，导致自己中途想换图形界面插件，浪费了点时间，这里记录下，总结下经验，理一下思路。独立完成一个移动端项目(不是很明白为何会有这样的商品管理后台)，还是有些经验不足，包括对产品的全局思考，对插件的选择等，都有考虑不周的缺点，导致自己中途想换图形界面插件，...

simpleapples 2019-08-23 15:42 评论0 收藏0
【技术】移动端适配 px2rem/px2vw 的原理与实现

摘要：不同的前端框架，配合等打包工具，可以更高效的使用这些插件，完成移动端适配的配置工作。简介【目标】：前端开发移动端及H5时候，不需要再关心移动设备的大小，只需要按照固定设计稿的px值布局！【基础】 dpr（设备像素比）css的像素px不等于设备像素/分辨率/各种值，css的px可以简单理解为虚拟像素，与设备无关，css的px需要乘dpr计算为设备像素； css3 的 rem，即ro...

AlexTuan 2019-08-22 18:41 评论0 收藏0