我有一个主页，然后是 4 个切换到不同 html 文件的选项卡。您单击“关于”选项卡，它会切换到 about.html 文件。所有 4 个选项卡/文件都使用相同的 CSS 文件 (main.css)。话虽如此，它们都使用相同的背景图像。我遇到的问题是，当我单击其中一个选项卡时，背景图像会消失一瞬间，然后重新出现，就好像它必须为每个选项卡重新加载一样。我该怎么做才能修复它，使图像不会在我每次单击选项卡时消失，从而在整个网站上保持一致？
这是添加背景图片的CSS代码
正文{
背景:url("IMG_0462.jpg") 不重复；
背景尺寸:封面；
}
这是我用于标签的 HTML 代码
<body>
<header>
<a href="index.html" id="logo">
<h1>Adam Birdsall</h1>
<h2>Software Engineer</h2>
</a>
<nav>
<ul>
<li><a href="index.html" class="selected">Overview</a></li>
<li><a href="resume.html">Resume</a></li>
<li><a href="portfolio.html">Portfolio</a></li>
<li><a href="contact.html">Contact</a></li>
</ul>
</nav>
</header>
<div id="wrapper">
<section>
</section>
</div>
</body>
最佳答案
您已将每个链接添加为单独的页面，这些页面需要加载才能让您看到它们，即使浏览器很可能会缓存您的图像，也会发生“重新加载”。
如果您的目标是在没有页面加载的情况下实现平稳过渡，则必须使用 Ajax 调用(或其他一些 javascript/CSS，即基于客户端的技术)。
您可以在整个网络上查看此类站点的示例，我发现一个可能对您有用的示例是 here
不幸的是，这不是一个简单的破解或修复，但是您一定会喜欢这样做，并且肯定不会有图像消失。
关于html - 使背景图像在整个站点 HTML/CSS 中保持一致，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/27350324/