在我的代碼中第一次輸入時看不到CSS-有解無憂

我正在使用 Laravel php。Head 和 Footer 標簽在我的 app.blade 檔案中。但它在第一次打開時不會在 head 標簽中運行預加載器。它也不會加載 css 檔案。它恰好在 1-2 秒后出現。截圖太快了，所以我把它作為視頻上傳了。我將添加下面的代碼行以及視頻。

https://youtu.be/ihHmQBsSpNs

app.blade.php 頭檔案代碼：

@if(!isset($lang)) @php($lang = 'tr') @endif
@php($slug = Request::segment(1))
<!DOCTYPE html>
<html lang="tr">
<head>  
<title>NovaPia Clinic</title>
<meta charset="UTF-8">
<meta name="description" content="NovaPia Clinic">
<meta name="keywords" content="Dentist, Clinic">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
  
 
    <!-- Stylesheets -->
    <link rel="stylesheet" href="{{ asset('theme/css/style.css')}}"/>
    <link rel="stylesheet" href="{{ asset('theme/css/responsive.css')}}"/>
    <link rel="stylesheet" href="{{ asset('theme/css/animate.css')}}"/>
    

    <link rel="shortcut icon" href="{{ asset('theme/img/favico.png')}}">    


    <link rel="stylesheet" href="{{ asset('theme/icon-fonts/fontawesome-5.0.6/css/fontawesome-all.min.css')}}"/>
    <link rel="stylesheet" href="{{ asset('theme/icon-fonts/flaticon/flaticon.css')}}"/>
    <link rel="stylesheet" href="{{ asset('theme/icon-fonts/flaticon/flaticon.svg')}}"/>
    <link rel="stylesheet" href="{{ asset('theme/icon-fonts/flaticon/flaticon.ttf')}}"/>
    <script src="https://kit.fontawesome.com/40e15e0d0d.js" crossorigin="anonymous"></script>


    <link rel="stylesheet" href="{{ asset('theme/font/stylesheet.css')}}"/>
   

</head> 
<body> 


<div id="preloader">
  <div class="loading-area">
    <div class="logo" style=""><img src="{{ asset('theme/img/nova.png')}}" alt=""></div>
    <span>yükleniyor...</span>
  </div>
  <div class="left-side"></div>
  <div class="right-side"></div>
</div>

<div class="page-overlay">
    <div class="page-transition"></div>
  </div>
<main>


  
  <header class="whitev">
 
    <a href="index.html" class="logo" data-type="ajax-load">
      <img src="{{ asset('img/nova.svg')}}" alt="">
    </a>

    <div class="nav-icon">
      <span></span>
      <span></span>
      <span></span>
      </div>
  </header>```

uj5u.com熱心網友回復：

您必須在正文中添加 display:none，并添加一個 setTimeout 以將顯示值更改為在 5 秒后阻塞，例如：

<body style="display:none" id="body_id">

<script>setTimeout(() => { document.getElementById('body_id').style.display = 'block'; }, "5000");</script>

轉載請註明出處，本文鏈接：https://www.uj5u.com/qukuanlian/496894.html

標籤：html css 拉拉维尔

上一篇：bootstrapjustify-content-center不適用于rowflex

下一篇：如何用順風聚焦div標簽？