html - Css 文件未在浏览器中加载

问题描述

我知道已经有很多人问过这类问题，但就我而言，情况不同。我正在使用css从 mydomain到 my 的文件subdomain。

我的页面：- https://forms.alapdorl.xyz/public/login

问题是当我在另一个浏览器或隐身模式下打开我的页面时，浏览器没有缓存我的 css 文件

但是当我手动打开我的css文件然后刷新它正在应用的页面时。

这是我的代码

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover"/>
    <meta http-equiv="X-UA-Compatible" content="ie=edge"/>
    <title>Login - Alapdorl</title>
    <link rel="preconnect" href="https://fonts.gstatic.com/" crossorigin>
    <meta name="msapplication-TileColor" content="#206bc4"/>
    <meta name="theme-color" content="#206bc4"/>
    <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent"/>
    <meta name="apple-mobile-web-app-capable" content="yes"/>
    <meta name="mobile-web-app-capable" content="yes"/>
    <meta name="HandheldFriendly" content="True"/>
    <meta name="MobileOptimized" content="320"/>
    <meta name="robots" content="noindex,nofollow,noarchive"/>
    <link href="https://fonts.googleapis.com/icon?family=Material+Icons"
rel="stylesheet">
    <link href="https://alapdorl.xyz/assets/css/tabler.css" rel="stylesheet"/>
    <link href="https://alapdorl.xyz/assets/css/demo.min.css" rel="stylesheet"/>
    <style> .separtor { display: flex; flex-direction: row; } .separtor:before, .separtor:after{ content: ""; flex: 1 1; border-bottom: 1px solid #dcdcdc; margin: auto; } .separtor:before { margin-right: 10px } .separtor:after { margin-left: 10px } </style>
  </head>
  <body class="antialiased">
     <div class="page" style="display:flex;justify-content:center;align-items:center">
               <div class="container">
          <div class="page-header" style="margin-top: -13%">
          <center>       
          <div class="col">
                <h1 class="page-title" style="font-size: 25px">Login</h1>
              </div>
            </center>
          </div>
       <div class="row justify-content-center">
       <div class="col">
              <form class="card card-lg" action="" method="post">
                <div class="card-body">
                <div class="mb-3">
  <label class="form-label">E-mail</label>
  <input type="email" class="form-control" name="email" placeholder="you@yourmail.com" autocomplete="off" required/>
</div>
<div class="mb-3">
  <label class="form-label">Password</label>
  <div class="input-group input-group-flat">
  <input type="password" class="form-control" name="password" placeholder="•••••••&quot; required/>
    <span class="input-group-text">
    <button class="material-icons" style="background:none;border:none;outline:none;font-size: 20px;color:inherit"> visibility </button>
    <button class="material-icons d-none" style="background:none;border:none;outline:none;font-size: 20px;color:inherit"> visibility_off </button>
    </span>
  </div>
</div>
<div class="form-footer"><button type="submit" class="btn btn-primary btn-block">Sign in</button></div>
<br>
                  <h5 class="separtor container">Or</h5>
<div class="form-footer"><a href="/login/index" class="btn btn-white btn-block"><img src="//alapdorl.xyz/assets/img/google_icon.png" height="20" style="float:left">&nbsp;Continue with Google</a></div>
                  </div>
                </form>
              </div>
            </div>
          </div>
        </div>    

       
    </body>
</html>

抱歉缩进不好

更新：-

我可以将我的文件移动到我的子域吗

标签： htmlcss

html - Css 文件未在浏览器中加载

问题描述

解决方案

推荐阅读