欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

普歌—智音团队 VScode 使用vw布局插件(实用)

程序员文章站 2022-05-24 23:53:58
...

聊一聊移动端页面适配-vw 在vscode上使用插件

vw在移动端屏幕适配是很好用的,但是如果计算起来就会很麻烦,那么下面我讲一下vscode如何使用vw插件

1.在vscode下载 px-to-vw
普歌—智音团队 VScode 使用vw布局插件(实用)
2.下载完毕后点击左下角的设置搜索px-to-vw, 箭头所指的位置就可以设置我们原型搞的宽度(我这里原型稿是360
普歌—智音团队 VScode 使用vw布局插件(实用)
3.使用插件
我们平时写页面都喜欢用px写,那么写完宽度(px)可以按Alt+Z 自动计算成vw的宽度

 > div:nth-child(2) {
    h2 {
      margin: 2.778vw 0 0.833vw 0;
      font-weight: 400;
    }
    p {
      padding: 0;
      margin: 2.778vw 0 0 0;
      color: #999;
    }
  }