我正在尝试在 VueJS 组件的样式标签中使用 @media 。 @media 中的样式始终有效,而不是使用宽度规则。
<template>
<header class="header"></header>
</template>
<script>
export default {
}
</script>
<style scoped>
.header {
height: 2000px;
background-color: black;
}
@media only screen and (min-width: 576px) {
.header {
height: 2000px;
background-color: white;
}
}
</style>
但是它在原始 .html 文件中按预期工作。
问题解决了。它与 vue.js 或任何东西无关。这是因为 index.html 文件中缺少元标记。
<meta name="viewport" content="width=device-width,initial-scale=1.0">
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)