gpt4 book ai didi

html - 导航菜单背景缺失

转载 作者:行者123 更新时间:2023-11-28 11:27:16 25 4
gpt4 key购买 nike

问题是我在左侧制作了带有 Logo 的菜单,我几乎可以肯定代码可以完美运行,因为当我运行代码并单击导航菜单应该位于的位置时,它是那里我的意思是一切都在它的位置和菜单是固定的....但是菜单的背景图像没有出现所以这是我的代码

HTML:

</head>
<body>
<div id="header">
<ul>
<li><a href="index.html" class="logo"></a></li>
<li><a href="index.html" class="home"></a></li>
<li><a href="Sugestology.html" class="sugestology"></a></li>
<li><a href="TheCreator.html" class="creator"></a></li>
<li><a href="InBulgaria.html" class="inbulgaria"></a></li>
<li><a href="Contacts.html" class="contacts" ></a></li>
</ul>
</div>

CSS:

#header {
position: fixed;
top: 0;
height: 80 px;
width:100%;
z-index:500;
}
#header ul {
padding-left: 0;
height: 80px;
}
#header li {
list-style: none;
float: left;
height: 80px;
width: 16.6%;
}
#header li a {
display: inline-block;
width: 100%;
height: 80px;
background-size: cover;
}
ul#header li a.logo {background: url("C:\Users\N\Desktop\Sugestology\nav_01.jpg") no-repeat 0 0}
ul#header li a.home {background: url("C:\Users\N\Desktop\Sugestology\nav_02.jpg") no-repeat 0 0}
ul#header li a.sugestology {background:url("C:\Users\N\Desktop\Sugestology\nav_03.jpg") no-repeat 0 0}
ul#header li a.creator {background: url("C:\Users\N\Desktop\Sugestology\nav_04.jpg") no-repeat 0 0}
ul#header li a.inbulgaria {background: url("C:\Users\N\Desktop\Sugestology\nav_05.jpg") no-repeat 0 0}
ul#header li a.contacts {background: url("C:\Users\N\Desktop\Sugestology\nav_06.jpg") no-repeat 0 0}

我已经尝试了几种链接图像的方法,尽管它们作为 css 文件和 html 文件位于 sam 文件夹中))

最佳答案

从图像中删除绝对路径。相反,这样做(假设所有内容都在同一个文件夹中,根据您的问题):

ul#header li a.logo {background: url("nav_01.jpg") no-repeat 0 0}
ul#header li a.home {background: url("nav_02.jpg") no-repeat 0 0}
ul#header li a.sugestology {background:url("nav_03.jpg") no-repeat 0 0}
ul#header li a.creator {background: url("nav_04.jpg") no-repeat 0 0}
ul#header li a.inbulgaria {background: url("nav_05.jpg") no-repeat 0 0}
ul#header li a.contacts {background: url("nav_06.jpg") no-repeat 0 0}

我还建议将图片放在单独的文件夹中 - 有助于整理东西!

更新:

您还在您的 CSS 中使用了 ul#header,但是您没有一个 id 为“header”的 UL。您在 div 上只有“标题”,因此您需要更改 CSS 以在 UL 上使用不同的 ID。或者,按如下方式更改您的 CSS:

#header ul li a.logo {background: url("nav_01.jpg") no-repeat 0 0}
#header ul li a.home {background: url("nav_02.jpg") no-repeat 0 0}
#header ul li a.sugestology {background:url("nav_03.jpg") no-repeat 0 0}
#header ul li a.creator {background: url("nav_04.jpg") no-repeat 0 0}
#header ul li a.inbulgaria {background: url("nav_05.jpg") no-repeat 0 0}
#header ul li a.contacts {background: url("nav_06.jpg") no-repeat 0 0}

关于html - 导航菜单背景缺失,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21304315/

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