【问题标题】:My CSS file not working in my PHP file我的 CSS 文件在我的 PHP 文件中不起作用
【发布时间】:2021-12-31 00:36:33
【问题描述】:

我不明白为什么每当我对它进行一些更改时,我的 css 文件就无法正常工作。我之前输入的代码可以正常工作,但是每当我更改代码时它都不会显示。

    <?php 
session_start();
 ?>

<?php 

  include "dbt_connect.php";

?>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Movies&amp;Stuff</title>
    <script src="https://code.jquery.com/jquery-3.3.1.js" integrity="sha256-2Kok7MbOyxpgUVvAk/HJ2jigOSYS2auK4Pfzbm7uH60="
  crossorigin="anonymous"></script>
  <link rel="stylesheet" href="FontAwesome/css/fontawesome-all.min.css">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="index.css">

  <style>
    #footer{
        width: 100%;
        height: 100px;
        margin-bottom: 0px;
        background-color: gray;
        text-align: center;
        color: white;
    }
    #footer pre{
        padding-top: 50px;
        font-size: 16px;
    }
    #footer a{
        color: white;
        text-decoration: none;
    }
  </style>

  <script type='text/javascript' src='//platform-api.sharethis.com/js/sharethis.js#property=5b0ae82b461c9500119099e0&product=sticky-share-buttons' async='async'></script>
</head>
<body>
    <header id="top_header" style="margin-top: 20px">
        <div class="clear">
        <h1 id="logo">Movies<span id="and">&amp;</span>Stuff</h1>
        <nav id="main_nav">
            <?php 
                if (isset($_SESSION['user_id'])) {
                    echo '
                    <a href="#" class="menu"><i class="fa fa-bars"></i></a>
                    <a href="Movies.php">Movies</a>
            <a href="TV Series.php">TV Series</a>
            <a href="AboutUs.php">About Us</a>
            <a href="ContactUs.php">Contact Us</a>

                    <form action="Includes/logout.inc.php" method="POST" style="float:right; margin-right:1em; border:none;">
                    <button type="submit" name="submit" style="background-color:black; border:none; color: #A5A5A5FF; font-size:17px;outline-style:none;">Logout</button>
                    </form>';
                }else{
                    echo '
                    <a href="#" class="menu"><i class="fa fa-bars"></i></a>
                    <a href="Movies.php">Movies</a>
            <a href="TV Series.php">TV Series</a>
            <a href="AboutUs.php">About Us</a>
            <a href="ContactUs.php">Contact Us</a>
            <span class="login" style="margin-right: -1em;"><a href="login.php">Login</a></span> | <span class="signup"><a href="signup.php">Signup</a></span>';
                }

             ?>

        </nav></div>

这是我的 php 文件代码,我在菜单中添加了一个使用 font awesome 的栏,并使它在我的 css 外部文件中不显示任何内容,但它只是显示出来。我不明白为什么我的 css 文件不适用于我的任何其他 php 文件。我在本地主机上运行它。我尝试重新启动它,但没有找到。

    *{
    margin:0 auto;
}
body{
    font-family: sans-serif;
    background-color: black;
    color:#A8A8A8FF;
}
h1 h2 h3 h4 h5 h6{
    font-weight: 500;
}
.clear{
    clear: both;
}
#top_header{
    height: 150px;
}

.menu{
    display: none;
}
#logo{
    float:left;
    padding: 20px;
    text-transform: uppercase;
    color: white;
}
#and{
    font-weight: normal;
}
#main_nav{
    float: right;
    padding: 30px;


#main_nav a{
    color: #A5A5A5FF;
    margin-right: 1em;
    text-decoration: none;
}
.search{
    display: inline-flex;
    font-size: 20px;
    width: 97%;

}
.searchterm{
    width: 97%;
    font-size: inherit;
    border: 0.1em solid #6D6D6DFF;
    border-radius: 0.5em 0 0 0.5em;
    padding:0.2em 0.5em;
    margin-left: 20px;
    outline-style: none;
    transition: 1s all;
}
.search-btn{
    font-size: inherit;
    border: 0.1em solid #6D6D6DFF;
    border-radius: 0 0.5em 0.5em 0;
    cursor: pointer;
    outline-style: none;
    width: 100px;

}
.search-btn i{
    color: #6B6B6BFF;
}
.searchterm:focus{
    border:0.1em solid #C6C6C6FF;
}

这是我的外部 css 代码,我在顶部标题下的类菜单中添加了 display:none,但我仍然一无所获。上次我在制作页脚时出现了这个问题,但它没有奏效,所以我在内部 css 中做了。请帮我解决这个问题。

【问题讨论】:

    标签: php html css


    【解决方案1】:

    缓存问题。

    尝试改变

    &lt;link rel="stylesheet" href="index.css"&gt;

    &lt;link rel="stylesheet" href="index.css?v=&lt;?php echo time(); ?&gt;"&gt;

    这将强制 CSS 重新加载。

    【讨论】:

      【解决方案2】:

      所以我遇到了这个问题,我的 CSS 代码工作正常,但是当我删除或添加一些内容时,它并没有在网站上改变,我找到了一个非常简单的解决方案,对我有用:

      只需按下:Ctrl + F5

      这被称为“硬刷新”,它适用于 Windows 和 Chrome 浏览器,如果您使用其他内容,请尝试此站点:link

      这是一个有点老的问题,但我现在遇到了同样的问题,我想也许我可以帮助别人。

      【讨论】:

      • 这不会避免服务器端缓存您的文件。
      【解决方案3】:

      它可能是缓存问题,只需删除所有浏览数据、历史记录、缓存、cookie 等,然后关闭浏览器并再次打开,它应该可以解决问题,因为它已经解决了我的问题。

      但实际解决此问题的最佳方法是使用 php.ini 调用 css 文件。我建议使用 php 调用您的 css 样式表,因为如果您的网站在线,您无法在每次对网站应用更改时告诉所有用户删除他们的浏览数据

      很简单,先写style标签,然后用php调用css文件。

      <style>
        <?php include "style.css" ?>
      </style>
      

      【讨论】:

        【解决方案4】:

        问题:我的浏览器无法访问我修改后的 CSS 文件

        原因:我的浏览器已经缓存了这个文件(浏览器已经有这个文件了,他不会再请求了)。

        解决方案 1 - 关于开发环境

        刷新浏览器的缓存(在 firefox 和 Chrome 上 ctrl+maj+R)。但是你不能在生产环境中这样做(你不能控制你客户的浏览器)

        解决方案 2 - 在生产环境中

        更新文件时更改文件的路径。最好的方法似乎是添加如下参数

        <link rel="stylesheet" href="index.css?v=1">
        

        并在每次生产修改时更改它

        <link rel="stylesheet" href="index.css?v=2">
        

        您可以使用一个变量来简化多个文件更改的更改。但请记住,每次您修改 CSS 的路径时,您的所有客户端都会再次请求该资源。例如,不要使用time() 作为值,否则它将取消您网站客户端的任何缓存(增加服务器费用)。

        它将同样适用于 JS 文件和任何其他不能被浏览器缓存的资源。

        【讨论】:

          【解决方案5】:

          对我来说解决了这个问题:
          之前:&lt;link rel="stylesheet" href="/css/style.css"&gt;
          之后:&lt;link rel="stylesheet" href="css/style.css"&gt; //Removed slash before css folder.

          【讨论】:

          • 小心!这样您就可以使用相对路径。这意味着如果您访问 your-domain.com/,此路径将是 your-domain.com/css/style.css,但是如果您访问其他页面,例如your-domain.com/user/abc,CSS 将从 your-domain.com/user/abc/css/style.css 加载。
          【解决方案6】:

          我在制作第一个 PHP 项目时遇到了同样的问题。我使用相对路径并通过创建新文件并将新文件链接到 index.php 文件中来更改 CSS 文件。这对我有用。

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

          【讨论】:

            【解决方案7】:

            @Varinderjit Kauranswer 类似,我将我的css 文件放在具有相对路径(例如../css/styles.css)的同级目录中。客户端浏览器无法访问此目录,因此无法显示。将css/ 目录移动到webroot(或html)目录下而不是id 旁边使其可以被客户端浏览器解析。此外,该链接随后使用绝对路径而不是相对路径(例如&lt;link rel="stylesheet" type="text/css" href="/css/styles.css"&gt;)。

            【讨论】:

              【解决方案8】:

              缓存绝对是我的问题。如果您使用 Chrome 作为浏览器,请在 Chrome 开发者工具设置中,选择网络部分下的禁用缓存(当 DevTools 打开时)。

              【讨论】:

                【解决方案9】:

                我也遇到过类似的问题,我的解决方法是修改你的css文件名,比如你之前的css文件名是index.css,改成newindex.css,别忘了修改文件名你的css文件也在你的html中。我希望它会起作用,它对我有用。

                【讨论】:

                  猜你喜欢
                  • 1970-01-01
                  • 1970-01-01
                  • 2019-06-23
                  • 1970-01-01
                  • 1970-01-01
                  • 2019-12-08
                  • 1970-01-01
                  • 1970-01-01
                  • 1970-01-01
                  相关资源
                  最近更新 更多