Как показывать прелоадер самым первым, минуя показ шапки?

Question

[Алексей Скляров]

Есть прелоадер, в CSS описывается так:

<style media="screen">
    #preloader {
      display: -webkit-flex;
      display: -ms-flex;
      display: flex;
      flex-direction: column;
      height: 100vh;
      width: 100vw;
      align-items: center;
      justify-content: center;
      position: fixed;
      top: 0;
      left: 0;
      z-index: 9999;
      transition: 0.3s all ease;
    }
  </style>

Этот кусок кода вставляется сразу после . После этих стилей уже подгружается сам style.css.

Но почему-то при загрузке страницы, на 1 секунду у меня показывается сама шапка, потом уже прелоадер. Причем и в коде, прелоадер стоит в самом начале, после . В чем может быть причина?

Answer 1

[4mobile]

скрывайте основной блок контента в css, показывайте его после полной загрузки страницы через js