媒体查询中的 vw 转换

[1390006090]

可以添加视口宽度吗？？跟随横竖屏 更换时候宽度

[wswmsword]

不好意思，没理解您的意思

[1390006090]

  postcsspxtoviewport8plugin({
      unitToConvert: 'px', // 需要转换的单位，默认为"px"
      viewportWidth: 1080, // 设计稿的视口宽度
      mediaQuery: true, // 媒体查询里的单位是否需要转换单位
      unitPrecision: 6, // 单位转换后保留的精度
      landscape: true, // 是否添加根据 landscapeWidth 生成的媒体查询条件 @media (orientation: landscape)
      landscapeUnit: 'vw',// 横屏时使用的单位
      landscapeWidth: 1920,// 横屏时使用的视口宽度

[1390006090]

landscape: true, // 是否添加根据 landscapeWidth 生成的媒体查询条件 @media (orientation: landscape)
就是这个功能

[wswmsword]

{
  "viewportWidth": 1080,
  "appSelector": "#app",
  "enableMediaQuery": true,
  "landscapeWidth": 1920,
}

插件可以设置媒体查询横屏下的视口宽度，您看下这个符合你的需求吗？上面的 "landscapeWidth": 1920 设置了横屏时的视口宽度 1920 像素，如果再设置 "desktop: xxx"，就是设置桌面端的视口宽度为 xxx。

[1390006090]

  "mobileUnit":"vw",
      "viewportWidth": 1080,
      "appSelector": "#app",
      "enableMediaQuery": true,
      "landscapeWidth": 1920,
      "desktopWidth":1920

[1390006090]

@media (min-width: 1920px) and (max-height: 640px), (max-width: 1920px) and (min-width: 1920px) and (orientation: landscape)

<style> .index-container .index-introduce[data-v-93195b7f], .index-container .index-menu[data-v-93195b7f] { height: 1848.889px;

[1390006090]

转换出来成这样了

[1390006090]

没转成vw还是px

[wswmsword]

转换的媒体查询代码，里面的单位是 px，这是因为匹配到媒体查询后，视图应该是保持不变的，也就是固定尺寸的。如果你看非媒体查询的代码，都已经转换为 vw 了。

[1390006090]

我以为都会转换....