刷新后，CSS 不会加载到我的 PHP 注册(注册)表单上

我正在学习PHP，我在网上找到了有用的教程，所以我正在尝试用PHP构建我的第一个网站。我在 CSS 实现方面有问题。我始终保持本地主机的选项卡，因此当我更改某些内容时，我不必每次都运行它。问题是，当我编写一些 CSS 时，它会加载到我的注册表单上，但是当我刷新页面时，就像我从未为该页面编写 CSS 一样。(对不起，英语不好，我希望你们明白我想说的话..(

这是注册.php代码：

     <div class="container">
    <div class="row" style="text-align:center;">
        <h3>EPO - Sistem - Registracija </h3>
    </div>
    <div class="row sub_msg">
        <p> Veb aplikacija za evidenciju predispitnih obaveza. </p>
    </div>
    <div class="row signup">
        <div class="row">
            <h3> Dobrodosli, molimo Vas, unesite podatke za registraciju. </h3>
        </div>
        <form action="" method="post" class="form-horizontal">
            <div class="row form-group input_group">
                <label for="" class="col-sm-2" >E-mail:</label>
                <div class="col-sm-10">
                    <input type="text" name="email" class="form-control">
                </div>
            </div>
            <div class="row form-group input_group">
                <label for="" class="col-sm-2" >Firstname:</label>
                <div class="col-sm-10">
                    <input type="text" name="firstname" id="firstname" class="form-control">
                </div>
            </div>
            <div class="row form-group input_group">
                <label for="" class="col-sm-2" >Lastname:</label>
                <div class="col-sm-10">
                    <input type="text" name="lastname" id="lastname" class="form-control">
                </div>
            </div>
            <div class="row form-group input_group">
                <label for="" class="col-sm-2" >Password:</label>
                <div class="col-sm-10">
                    <input type="password" name="password" id="password" class="form-control">
                </div>
            </div>
            <div class="row form-group" style="margin:0px 10px 20px 10px">
                <div class="col-xs-12">
                    <input type="submit" name="submit" id="Registruj se" class="form-control">
                </div>
            </div>


        </form>
    </div>
</div>

这是索引页面：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>EPO - Pocetna stranica</title>
    <!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
<link rel="stylesheet" href=" ./css/custom.css">
</head>
<body>
    <nav class="navbar" style="background-color: #c40707">
  <div class="container">
    <div class="navbar-header">
      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span> 
      </button>
      <a class="navbar-brand crud" style="color: darkgray !important" href="#">EPO Aplikacija</a>
    </div>
   </div>
</nav>
   <div class="container">
     <ul class="nav nav-tabs">
         <li><a data-toggle='tab' href="#index">Pocetna stranica</a></li>
         <li><a data-toggle='tab' href="#login">Ulogujte se</a></li>
         <li><a data-toggle='tab' href="#signup">Prijavite se</a></li>
     </ul>

<div class="tab-content">
    <div id="index" class="tab-pane fade in">
         <p>Index</p>  
    </div>
    <div id="login" class="tab-pane fade in">
           <p>Login</p>
    </div>
    <div id="signup" class="tab-pane fade in">
           <?php include("./user/signup.php"); ?>
    </div>

    </div>  

   </div>


</body>
</html>

这是 css 代码：

body{
    background-color: darkgray;
    font-size: 22px;
    margin: 0;
    padding: 0;
}

.crud{
    width:auto;
    color: #605d5d !important;
    font-size: 25px;
    font-weight: 800;
}

.sub_msg{
    text-align: center;
    padding: 10px 0px 20px 0px;
}
.signup{
    border: 1px solid #c40707;
    text-align: center;
    width: 60%;
    height: auto;
    margin: auto;
}
.input_group{
    margin: 0px 20px 20px 20px;
}
.input_group input{
    height: 40px;
    font-size: 20px;
}
input[type="submit"]{
    height: 40px;
    font-size: 20px;
    font-weight: bold;
    background-color: #c40707;
    color: #605d5d !important;
}

我卡了她两个多小时，我很确定这是一些初学者的愚蠢错误，但我找不到它。

更正从 <link rel="stylesheet" href=" ./css/custom.css"> 到 <link rel="stylesheet" href="./css/custom.css"> 的路径

如果仍然不起作用，则强制浏览器刷新样式表。

通过添加版本号进行检查，例如

<link rel="stylesheet" type="text/css" href="./css/custom.css?version=51">

在下面的代码中，href 属性中有不需要的空间。

<link rel="stylesheet" href=" ./css/custom.css">

应该是：

<link rel="stylesheet" href="./css/custom.css">

此外，有时您可能需要清除缓存才能显示 css 中的更改。

在这种情况下，因为按下刷新按钮可能会变得很烦人，而不是进行刷新，我在 css url 的末尾添加一个随机值，使其看起来像一个新 url，这样就不会发生缓存。

喜欢

<link rel="stylesheet" href="./css/custom.css?<?php echo rand(1,300);?>">

尝试更改此行(假设您的 css 文件夹与索引处于同一级别.php(

<link rel="stylesheet" href=" ./css/custom.css">

对此，这个

<link rel="stylesheet" href="css/custom.css?t=<?php echo time(); ?>">

在投入生产后删除<?php echo time(); ?>，因为它意味着开发，这样如果 css 中的更改未反映在浏览器中，则无需清除缓存或硬重新加载。

相关内容

最新更新

热门标签：