Media query не работает в теге стиля VueJS

Media query не работает в теге стиля VueJS

26.01.2020 02:52:11 Просмотров 43 Источник

Я пытаюсь использовать @media в тегах стиля компонента VueJS. Стиль в @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>

Однако он работает, как и ожидалось в raw .HTML-файл.

У вопроса есть решение - Посмотреть?

https://stackoverflow.com/questions/59914416/media-query-does-not-work-in-vuejs-style-tag#comment105994649_59914416
Похоже, он просто не работает на мобильном представлении chrome developer tools с npm run serve.

Ответы - Media query не работает в теге стиля VueJS / Media query does not work in VueJS style tag

Является ответом!
Mansur

28.01.2020 02:19:22

Проблема решена. Это не связано с vue.js или что-нибудь еще. Это происходит из-за отсутствия мета-тега в индексе.HTML-файл.

<meta name="viewport" content="width=device-width,initial-scale=1.0">
Помочь в развитии проекта:
Закрыть X