这里搭配SCSS做的媒体查询
媒体查询语法搭配scss:
注意:
1.max-width 表示当前屏幕处于575px以下就生效
2.min-width 表示当前屏幕处于575px以上生效
main.scss:root{
--mobileWidth: 575px;
}
Vue 文件
<style lang="scss" scoped>
.nowWidth{font-size: 16px;
@media screen and (max-width: --mobileWidth){
font-size: 12px;
}
}
</style>