成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

好用的px轉(zhuǎn)rem插件推薦

Clect / 1368人閱讀

摘要：然而在固定布局時(shí)我們通常以為基準(zhǔn)單位進(jìn)行調(diào)整，進(jìn)而通過計(jì)算獲取的值，這時(shí)如果有個(gè)好用的轉(zhuǎn)工具會(huì)讓工作事半功倍。啟用此插件的文件類型。輸入值后按下鍵直接轉(zhuǎn)換，使用取消轉(zhuǎn)換

在響應(yīng)式布局中，rem這個(gè)css單位已經(jīng)慢慢嶄露頭角，成為最佳解決方案之一。然而在固定布局時(shí)我們通常以px為基準(zhǔn)單位進(jìn)行調(diào)整，進(jìn)而通過計(jì)算獲取rem的值，這時(shí)如果有個(gè)好用的px轉(zhuǎn)rem工具會(huì)讓工作事半功倍。本文將推薦一些常用開發(fā)工具的px轉(zhuǎn)rem插件

VSCode插件 1、cssrem

安裝 
快捷鍵ctrl+p打開轉(zhuǎn)到文件搜索框，輸入命令：ext install cssrem
配置

參數(shù)配置文件：VSCode -> 文件 -> 設(shè)置 -> 搜索cssrem

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

cssrem.fixedDigits px轉(zhuǎn)rem小數(shù)點(diǎn)最大長度，默認(rèn)：6。

cssrem.autoRemovePrefixZero 自動(dòng)移除0開頭的前綴，默認(rèn)：true

該插件可以在輸入時(shí)選擇轉(zhuǎn)換，也可以使用ctrl+p，ctrl+r快捷鍵轉(zhuǎn)換，支持html vue css less scss sass等文件格式或自定義文件

2、px to rem 安裝 
快捷鍵ctrl+p打開轉(zhuǎn)到文件搜索框，輸入命令：ext install px-to-rem
配置

參數(shù)配置文件：VSCode -> 文件 -> 設(shè)置 -> 搜索px to rem

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

px-to-rem.number-of-decimals-digits: 最多保留的小數(shù)位

px-to-rem.only-change-first-ocurrence: 轉(zhuǎn)換全部或只轉(zhuǎn)換當(dāng)前選擇的

px-to-rem.notify-if-no-changes: 啟用/關(guān)閉通知

選中要轉(zhuǎn)換的值，使用快捷鍵Alt+z執(zhí)行px轉(zhuǎn)rem或rem轉(zhuǎn)px

Sublime Text插件 1、cssrem插件

安裝 
下載本項(xiàng)目，比如：git clone https://github.com/flashlizi/cssrem
進(jìn)入packages目錄：Sublime Text -> Preferences -> Browse Packages...
復(fù)制下載的cssrem目錄到剛才的packges目錄里。
重啟Sublime Text。
配置

參數(shù)配置文件：Sublime Text -> Preferences -> Package Settings -> cssrem

px_to_rem - px轉(zhuǎn)rem的單位比例，默認(rèn)為40。

max_rem_fraction_length - px轉(zhuǎn)rem的小數(shù)部分的最大長度。默認(rèn)為6。

available_file_types - 啟用此插件的文件類型。默認(rèn)為：[".css", ".less", ".sass"]。

輸入px值后按下Enter鍵直接轉(zhuǎn)換，使用Ctrl+z取消轉(zhuǎn)換

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/115944.html

相關(guān)文章

  • PostCSS真的太好用了！

    摘要：下面的代碼違反規(guī)則下面的代碼符合規(guī)則禁止使用十六進(jìn)制顏色十六進(jìn)制的顏色違反規(guī)則無效的十六進(jìn)制色同樣違規(guī)下面的是符合規(guī)則的自動(dòng)將十六進(jìn)制色轉(zhuǎn)換為大寫或者小寫可以使用實(shí)現(xiàn)同樣的功能。 showImg(https://segmentfault.com/img/remote/1460000014782565); 在PostCSS官網(wǎng)有著這樣的對(duì)PostCSS特性介紹，箭頭后面是對(duì)應(yīng)功能的插件及...

    SKYZACK 評(píng)論0 收藏0

  • vw+rem移動(dòng)端自適應(yīng)布局

    摘要：本文同步發(fā)布于我的個(gè)人博客上移動(dòng)端自適應(yīng)布局不管是面試還是工作過程中，移動(dòng)端的布局都比較常見，而移動(dòng)端適配方法也是多種多樣。表示當(dāng)前視口寬度的百分之一。同時(shí)在移動(dòng)端，的兼容性還不錯(cuò)，完全可以直接使用。這樣完成了一個(gè)簡單好用的移動(dòng)端布局了 本文同步發(fā)布于我的個(gè)人博客上 - vw+rem移動(dòng)端自適應(yīng)布局 不管是面試還是工作過程中，移動(dòng)端的布局都比較常見，而移動(dòng)端適配方法也是多種多樣。一般來...

    Little_XM 評(píng)論0 收藏0

  • 使用vue開發(fā)移動(dòng)端管理后臺(tái)

    摘要：獨(dú)立完成一個(gè)移動(dòng)端項(xiàng)目不是很明白為何會(huì)有這樣的商品管理后臺(tái)，還是有些經(jīng)驗(yàn)不足，包括對(duì)產(chǎn)品的全局思考，對(duì)插件的選擇等，都有考慮不周的缺點(diǎn)，導(dǎo)致自己中途想換圖形界面插件，浪費(fèi)了點(diǎn)時(shí)間，這里記錄下，總結(jié)下經(jīng)驗(yàn)，理一下思路。 獨(dú)立完成一個(gè)移動(dòng)端項(xiàng)目(不是很明白為何會(huì)有這樣的商品管理后臺(tái))，還是有些經(jīng)驗(yàn)不足，包括對(duì)產(chǎn)品的全局思考，對(duì)插件的選擇等，都有考慮不周的缺點(diǎn)，導(dǎo)致自己中途想換圖形界面插件，...

    simpleapples 評(píng)論0 收藏0

  • 【技術(shù)】移動(dòng)端適配 px2rem/px2vw 的原理與實(shí)現(xiàn)

    摘要：不同的前端框架，配合等打包工具，可以更高效的使用這些插件，完成移動(dòng)端適配的配置工作。 簡介 【目標(biāo)】：前端開發(fā)移動(dòng)端及H5時(shí)候，不需要再關(guān)心移動(dòng)設(shè)備的大小，只需要按照固定設(shè)計(jì)稿的px值布局！【基礎(chǔ)】 dpr（設(shè)備像素比）css的像素px不等于設(shè)備像素/分辨率/各種值，css的px可以簡單理解為虛擬像素，與設(shè)備無關(guān)，css的px需要乘dpr計(jì)算為設(shè)備像素； css3 的 rem，即ro...

    AlexTuan 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<