Проблема с использованием CSS для стилизации шаблона VUE - PullRequest
0 голосов
/ 29 декабря 2018

Я делаю страницу входа, и у меня возникают проблемы с использованием CSS для стилизации шаблонов vue.

Без vue у меня все работает, вот мой код:

HTML

<body class="text-center">
    <form class="form-signin">
        <h1 class="h3 mb-3 font-weight-normal">Please sign in</h1>
        <label for="inputEmail" class="sr-only">Email address</label>
        <input type="email" id="inputEmail" class="form-control" placeholder="Email address" required autofocus>
        <label for="inputPassword" class="sr-only">Password</label>
        <input type="password" id="inputPassword" class="form-control" placeholder="Password" required>
        <div class="checkbox mb-3">
            <label>
                <input type="checkbox" value="remember-me"> Remember me
            </label>
        </div>
        <button class="btn btn-lg btn-primary btn-block" type="submit">Sign in</button>
        <p class="mt-5 mb-3 text-muted">&copy; 2017-2018</p>
    </form>
</body>

CSS

html,
body {
  height: 100%;
}

body {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  padding-top: 40px;
  padding-bottom: 40px;
  background-color: #f5f5f5;
}

Когда я делаю то же самое в шаблоне Vue, это не работает, потому что я использую тег html и body в css.Как я могу достичь того же результата (мудрый стиль) в шаблоне vue без использования html и тега body.

Используя то, что было рекомендовано:

с vue

без vue

он работает лучше, чем раньше, но он все еще не работает на 100%, я пробовал это раньше, и это тоже случилось, есть идеи о том, как исправить?

1 Ответ

0 голосов
/ 30 декабря 2018

Пожалуйста, внимательно прочитайте документацию о том, как работает VUE.Обычно vue подключается к div#app и все происходит там, поэтому при написании стилей внутри компонента вы не можете получить теги body и html.Если вам действительно нужны эти стили для этих тегов, вы можете использовать внешний файл CSS и подключить его к HTML.Но старайтесь избегать использования CSS в прямом index.html, потому что позже вы можете забыть, где вы это делали, поэтому вы потратите лот времени, пытаясь найти это.

Я не знаюЯ не вижу причин делать то, что ты хочешь.Это легко сделать, не касаясь html и body.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...