我不明白为什么每当我对其进行一些更改时我的 css 文件就不起作用。我之前输入的代码工作正常,但每当我更改代码时,它就不会显示。
<?php
session_start();
?>
<?php
include "dbt_connect.php";
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Movies&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">&</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中做了它。请帮我解决这个问题。
缓存问题。
尝试改变
<link rel="stylesheet" href="index.css">
到
<link rel="stylesheet" href="index.css?v=<?php echo time(); ?>">
这将强制 CSS 重新加载。
所以我遇到了这个问题,我的 CSS 代码工作正常,但是当我删除或添加某些内容时,它在网站上没有改变,我找到了一个非常简单的解决方案,对我有用:
只需按:Ctrl + F5
这称为“硬刷新”,它在 Windows 上对我有用,对于 Chrome 浏览器,如果您使用其他浏览器,请尝试此网站:link
这是一个有点老的问题,但我现在遇到了同样的问题,我想也许我可以帮助别人。
这可能是缓存问题,只需删除所有浏览数据、历史记录、缓存、cookie 等,然后关闭浏览器并再次打开,它应该可以解决我的问题。
但是实际解决这个问题的最好方法是使用 php.ini 调用 css 文件。我建议使用 php 调用您的 css 样式表,因为如果您的网站在线,您无法告诉所有用户每次在网站上应用更改时删除他们的浏览数据
很简单,先写style标签,然后用php调用css文件。
<style>
<?php include "style.css" ?>
</style>
问题:我的浏览器无法访问我修改过的CSS文件
原因:我的浏览器已经缓存了这个文件(浏览器已经有这个文件了,他就不会再索要了)。
刷新浏览器的缓存(在 Firefox 和 Chrome 上按 ctrl+maj+R)。但你不能在生产中这样做(你无法控制客户端的浏览器)
更新文件时更改文件的路径。最好的方法似乎是添加如下参数
<link rel="stylesheet" href="index.css?v=1">
并在每次生产修改时更改它
<link rel="stylesheet" href="index.css?v=2">
您可以使用变量来简化多个文件更改的更改。但请记住,每次修改 CSS 路径时,所有客户端都会再次请求该资源。例如,请勿使用
time()
作为值,否则它将取消网站客户端的任何缓存(增加服务器费用)。
它将同样适用于 JS 文件和任何其他浏览器无法缓存的资源。
对我来说解决了这个问题:
之前:
<link rel="stylesheet" href="/css/style.css">
<link rel="stylesheet" href="css/style.css"> //Removed slash before css folder.
我在制作第一个 Php 项目时遇到了同样的问题。我使用相对路径,并通过创建新文件并在 index.php 文件中链接该新文件来更改 CSS 文件。这对我有用。
<link href="./styles.css" rel="stylesheet">
与@Varinderjit Kaur的answer类似,我将CSS文件放置在具有相对路径的同级目录中(例如
../css/styles.css
)。 客户端浏览器无法访问该目录,因此无法显示。 将 css/
目录移到 webroot
(或 html
)目录下而不是放在 id 旁边,使其可以由客户端浏览器解析。 此外,该链接使用绝对路径而不是相对路径(例如 <link rel="stylesheet" type="text/css" href="/css/styles.css">
)。
缓存绝对是我的问题。如果您使用 Chrome 作为浏览器,请在 Chrome 开发者工具设置中的网络部分下选择禁用缓存(当 DevTools 打开时)。
使用 Ctrl + f5 可以轻松更新 css
const raq = document.querySelector("#raquette");
const ball = document.querySelector("#ball");
const sc = document.querySelector("#score");
const go = document.querySelector("#gameover");
const ta = document.querySelector("#tryagain");
let score = 1;
let by = 0;
let rx = 0;
function bar_move (e){
console.log(e) ;
if(e.key == "ArrowRight"){
rx+=10;
raq.style.left = rx + "px";
if(raq.style.left == "600px"){
raq.style.left = "0px";
rx = 0;
}
}
else if(e.key == "ArrowLeft"){
rx-=10;
raq.style.left = rx + "px";
if(raq.style.left == "-60px"){
raq.style.left = "540px";
rx = 540;
}
}
}
document.addEventListener('keydown',bar_move)
const randomLocalisation = () => {
return Math.random()*550;
}
let bx = randomLocalisation();
function ball_move(e){
by+=10
ball.style.left = bx + "px"
ball.style.top = by + "px"
if(ball.style.top == "550px"){
clearInterval(mball)
ball.style.display = "none"
raq.style.display = "none"
sc.style.display = "none"
go.style.display = "block"
ta.style.display = "block"
}
else if(ball.style.top == "540px" && bx<(rx+60) && bx>(rx-60)){
ball.style.top = 0 + "px"
sc.textContent = score
score +=1
by = 0;
bx = randomLocalisation();
}
}
const mball = setInterval(ball_move, 100)
const trya = (e) => {
go.style.display = "none"
ta.style.display = "none"
ball.style.display = "block"
sc.style.display = "block"
raq.style.display = "block"
score = 0
by = 0
mball = setInterval(ball_move, 100)
}
ta.addEventListener('click', trya)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Login</title>
</head>
<body>
<form method="POST">
username: <input type="text" name="username"><br>
password: <input type="password" name="password"><br>
<input type="Submit" name="Submit" value="Log in">
</form>
<?php
require_once "users0.php" ;
session_start() ;
if(isset($_POST['Submit'])){
$u = $_POST['username'] ;
$pw = $_POST['password'] ;
if($data[$u] == $u && $data[$u] == $pw){
header('location:../index.php') ;
exit();
}
else
echo "invalid Password/Username !" ;
}
?>
</body>
</html>
我也遇到过类似的问题,我的解决方案是更改你的css文件的名称,例如你以前的css文件名称是index.css,将其更改为newindex.css,并且不要忘记编辑你的css名称文件也包含在你的html中。我希望它会起作用,它对我有用。