gpt4 book ai didi

html - 使背景图像在整个站点 HTML/CSS 中保持一致

转载 作者:太空宇宙 更新时间:2023-11-04 12:35:00 26 4
gpt4 key购买 nike

我有一个主页,然后是 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/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com