ネイティブvw--携帯端末ソリューションを使用する場合に比べ、より柔軟VUE-CLIプロジェクト

インストール
コマンドラインを:

糸はpostcss-PXを-に、ビューポートの追加します

  

若しくは 

NPM I postcss-PX-にビューポート-save -dev

 

設定
package.json、コードpostcssを追加します。

"postcss":{ 
"プラグイン":{ 
"autoprefixer":{}、
"ツービューポートpostcss-PX":{ 
"viewportWidth" 750、
"minPixelValue":1 
} 
} 
}、

 



CI:
"viewportWidth":750、//設計案幅
"unitPrecision":3、VWへの//ピクセルのターン、数字VHの小数点以下
"minPixelValue":1、//最小のPX VWに変換されません値

使用シナリオ
VWとVHは、設計が生まれ移動端末に発行された場合PX装置は、従って以下REMであり、(750pxを覚えている)というだけフレキシブル変換一定の幅よりも、移動端末とPCに完全なアクセスユニットVWの効果を有するであろうフォントは、ページが大きすぎるので、PC側に表示されるようになり、アプリケーションのシナリオに応じて、適宜、選択し対処すべき
VUE-cli3.0はLIB-柔軟/ px2remを導入

互換性
VW / VHユニットは、実際のサポートは非常に良いではありません直前に、以前表示され、現在は、ブラウザの開発に、ブラウザの過半数(92%)は、VW / VHをサポートしてきました

おすすめ

転載: www.cnblogs.com/mmykdbc/p/10956622.html