gpt4 book ai didi

html - 使用 HTML Div 制作导航栏

转载 作者:太空宇宙 更新时间:2023-11-04 08:28:38 25 4
gpt4 key购买 nike

我刚刚开始网络开发,我正在尝试用一堆“Div”元素构建一个页面导航栏,但我似乎无法让我的第二个按钮(“AboutButton”)出现在屏幕。这是我的 HTML 正文代码:

<body>

<div id="navbar" id="top">
<div id="pageselection">
<div id="HomeButton"> <a href="#top"> HOME </a> </div>
<div id="AboutButton"> <a href="#About> ABOUT </a> </div>
</div>
</div>


</body>

这是我的页面 CSS:

#navbar{
Position: fixed;
Width: 100%;
Height: 10%;
}

#pageselection{
Position: absolute;
Width: 40%;
Height: 100%;
Right: 30%;
}

#HomeButton{
Position: absolute;
Width: 33%;
Height: 100%;
Left: 0%;
text-align: center;
}

#AboutButton{
Position: absolute;
Width: 33%;
Height: 100%;
Left: 33%;
text-align: center;
}

基本上,我正在尝试构建一个横跨页面顶部的“div”,然后将该“div”的中央 40% 标记为放置第二个“div”的空间,这将依次持有用户可以用来导航页面的三个链接。

提前致谢,希望这是一个愚蠢的错误,我希望我的描述足够清楚:)

最佳答案

你错过了一个引号

<a href="#About>

如果您只是初学者,我建议您使用一些免费的编辑器,例如 AtomSublime这将提醒您注意此类错误。

此外,不允许在一个元素上使用两次“id”。更好的做法是使用 classes您可以像这样堆叠它们:

<div class="navbar top"></div>

关于html - 使用 HTML Div 制作导航栏,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44956202/

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