Html 端部div标签连接到错误的头部div标签_Html

Html 端部div标签连接到错误的头部div标签

html

Html 端部div标签连接到错误的头部div标签,html,Html,应该在这里结束，而应该在这里结束我的div应该以评论结尾。唯一一个结束于该div的div 为什么div以错误的标签（很抱歉，如果格式很糟糕，我不经常使用它，所以我的格式和问题可能很糟糕。）卡莱布做了这件事卡莱布做了这件事由卡莱布我叔叔给了我很多帮助乔纳森所有图标都是由您的“notBar”div似乎在页脚之后而不是在“header”div中关闭。请尝试以下操作： <div id="header"> <div id="mySidebar"&g

应该在这里结束

，而应该在这里结束

我的div应该以评论结尾。唯一一个结束于该div的div

为什么div以错误的

标签

（很抱歉，如果格式很糟糕，我不经常使用它，所以我的格式和问题可能很糟糕。）


卡莱布做了这件事
卡莱布做了这件事
由
卡莱布
我叔叔给了我很多帮助
乔纳森
所有图标都是由

您的“notBar”div似乎在页脚之后而不是在“header”div中关闭。请尝试以下操作：

    <div id="header">
    <div id="mySidebar">
        <a href="javascript:hideMenu()"class="Links" id="close">Close <b>X</b></a>
        <a href="" class="Links link">About</a>
        <a href="index.html" class="Links link">Home</a>
        <a href="" onclick="myAccFunc()" class="Links link">Websites</a>
    </div> <!--  End of mySidebar Div  -->
    <div id="notBar">
        <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAACZSURBVGhD7djBCcJAGETh1QpiKzakxViDYCtpwSKUNKIzh9wW/pziuLwP3jFhQgzCNgAAMLijuqq7eoTlTd7mjaWb+oTnjaWn6l2clDeWhnkjB5X8jVyUNwIAsk3qFJY3bXZWi+r9oyb0Vt5YmlXvBkl5Y2mYB/Fre6neDRLytk0/rdXff+wAgJ/ggG7HOKBLiwM6AACQr7UvP+370u9envwAAAAASUVORK5CYII=" alt="Menu Bar" style="width: 35px; height: 40px;" id="menu" onclick="showMenu()"> 
        <center class="center">Caleb Did This</center>
    </div> <!-- End of notBar Div-->    
</div> <!-- End of Header Div  -->

<img src="https://cdn.pixabay.com/photo/2016/10/25/12/28/iceland-1768744_960_720.jpg" id="Ice">
<footer>

    <p class="pmargin"><span class="gray">Created and designed by</span> <span class="names">Caleb</span></p>
    <p><span class="gray">Lots of help from my uncle</span> <span class="names">Jonathan</span></p>
    <p class="icon"><span class="gray">All Icons were made by</span></p> <a href="https://icons8.com" class="a"><span class="names">Icons8</span></a>

</footer>


卡莱布做了这件事
由Caleb创建和设计
我叔叔乔纳森给了我很多帮助
所有图标都是由

这是您的文档结构：

<!DOCTYPE html>
<html>
<head>
    <title>Caleb Did This</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" type="text/css" href="Caleb.css">
</head>
<body>

<div id="header">
     <div id="mySidebar">
            <a href="javascript:hideMenu()"class="Links" id="close">Close <b>X</b></a>
            <a href="" class="Links link">About</a>
            <a href="index.html" class="Links link">Home</a>
            <a href="" onclick="myAccFunc()" class="Links link">Websites</a>
    </div> <!--  End of mySidebar Div  -->
    <div id="notBar">
            <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAACZSURBVGhD7djBCcJAGETh1QpiKzakxViDYCtpwSKUNKIzh9wW/pziuLwP3jFhQgzCNgAAMLijuqq7eoTlTd7mjaWb+oTnjaWn6l2clDeWhnkjB5X8jVyUNwIAsk3qFJY3bXZWi+r9oyb0Vt5YmlXvBkl5Y2mYB/Fre6neDRLytk0/rdXff+wAgJ/ggG7HOKBLiwM6AACQr7UvP+370u9envwAAAAASUVORK5CYII=" alt="Menu Bar" style="width: 35px; height: 40px;" id="menu" onclick="showMenu()"> 
            <center class="center">Caleb Did This</center>
    </div> <!-- End of NotBar  -->

    <img src="https://cdn.pixabay.com/photo/2016/10/25/12/28/iceland-1768744_960_720.jpg" id="Ice">
    <footer>

            <p class="pmargin"><span class="gray">Created and designed by</span> <span class="names">Caleb</span></p>
            <p><span class="gray">Lots of help from my uncle</span> <span class="names">Jonathan</span></p>
            <p class="icon"><span class="gray">All Icons were made by</span></p> <a href="https://icons8.com" class="a"><span class="names">Icons8</span></a>

     </footer>
</div> <!-- End of header Div-->
<script type="text/javascript" src="Caleb.js">
</script>
</body>
</html>

卡莱布做了这件事卡莱布做了这件事由Caleb创建和设计我叔叔乔纳森给了我很多帮助

所有图标都是由

我想你想要这样的东西：

<!DOCTYPE html>
<html>
<head>
    <title>Caleb Did This</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" type="text/css" href="Caleb.css">
</head>
<body>

    <div id="header">
        <div id="mySidebar">
            <a href="javascript:hideMenu()"class="Links" id="close">Close <b>X</b></a>
            <a href="" class="Links link">About</a>
            <a href="index.html" class="Links link">Home</a>
            <a href="" onclick="myAccFunc()" class="Links link">Websites</a>
        </div> 
        <div id="notBar">
            <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAACZSURBVGhD7djBCcJAGETh1QpiKzakxViDYCtpwSKUNKIzh9wW/pziuLwP3jFhQgzCNgAAMLijuqq7eoTlTd7mjaWb+oTnjaWn6l2clDeWhnkjB5X8jVyUNwIAsk3qFJY3bXZWi+r9oyb0Vt5YmlXvBkl5Y2mYB/Fre6neDRLytk0/rdXff+wAgJ/ggG7HOKBLiwM6AACQr7UvP+370u9envwAAAAASUVORK5CYII=" alt="Menu Bar" style="width: 35px; height: 40px;" id="menu" onclick="showMenu()"> 
            <center class="center">Caleb Did This</center>
        </div> 
    </div>
        <img src="https://cdn.pixabay.com/photo/2016/10/25/12/28/iceland-1768744_960_720.jpg" id="Ice">
    <footer>
            <p class="pmargin"><span class="gray">Created and designed by</span> <span class="names">Caleb</span></p>
            <p><span class="gray">Lots of help from my uncle</span> <span class="names">Jonathan</span></p>
            <p class="icon"><span class="gray">All Icons were made by</span></p> <a href="https://icons8.com" class="a"><span class="names">Icons8</span></a>
    </footer>
<script type="text/javascript" src="Caleb.js">
</script>
</body>
</html>


卡莱布做了这件事
卡莱布做了这件事
由Caleb创建和设计
我叔叔乔纳森给了我很多帮助
所有图标都是由

我用HTML5标记替换了您的代码中的一些div，这将显示出哪里出了问题（有关详细信息，请参阅我在HTML中的注释）：


卡莱布做了这件事
卡莱布做了这件事
由
卡莱布
我叔叔给了我很多帮助
乔纳森
所有图标都是由

实际上，您将各种div放错了位置（尤其是结束元素）。用原生HTML5元素替换它们应该会揭示出发生了什么——请参阅我的评论，了解正在发生的问题。

您需要清理并正确放置这些元素（不能在标题元素中嵌套旁侧或主节）。这需要将文档的各个部分旋转到正确的位置。

notBar div是指不属于侧边栏的任何内容。因此，页脚应该是notBar div的一部分。您将

放错了位置。该div关闭的时间要早得多（您在关闭标记上的注释顺序不正确）。。。

<!DOCTYPE html>
<html>
<head>
    <title>Caleb Did This</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" type="text/css" href="Caleb.css">
</head>
<body>

    <div id="header">
        <div id="mySidebar">
            <a href="javascript:hideMenu()"class="Links" id="close">Close <b>X</b></a>
            <a href="" class="Links link">About</a>
            <a href="index.html" class="Links link">Home</a>
            <a href="" onclick="myAccFunc()" class="Links link">Websites</a>
        </div> 
        <div id="notBar">
            <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAACZSURBVGhD7djBCcJAGETh1QpiKzakxViDYCtpwSKUNKIzh9wW/pziuLwP3jFhQgzCNgAAMLijuqq7eoTlTd7mjaWb+oTnjaWn6l2clDeWhnkjB5X8jVyUNwIAsk3qFJY3bXZWi+r9oyb0Vt5YmlXvBkl5Y2mYB/Fre6neDRLytk0/rdXff+wAgJ/ggG7HOKBLiwM6AACQr7UvP+370u9envwAAAAASUVORK5CYII=" alt="Menu Bar" style="width: 35px; height: 40px;" id="menu" onclick="showMenu()"> 
            <center class="center">Caleb Did This</center>
        </div> 
    </div>
        <img src="https://cdn.pixabay.com/photo/2016/10/25/12/28/iceland-1768744_960_720.jpg" id="Ice">
    <footer>
            <p class="pmargin"><span class="gray">Created and designed by</span> <span class="names">Caleb</span></p>
            <p><span class="gray">Lots of help from my uncle</span> <span class="names">Jonathan</span></p>
            <p class="icon"><span class="gray">All Icons were made by</span></p> <a href="https://icons8.com" class="a"><span class="names">Icons8</span></a>
    </footer>
<script type="text/javascript" src="Caleb.js">
</script>
</body>
</html>

<!DOCTYPE html>
<html>
<head>
<title>Caleb Did This</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="Caleb.css">
</head>
<body>
<header> <!-- div class="header" replaced with HTML5 element -->
<aside> <!-- div class="mySidebar" replaced with aside element -->
<!-- WARNING: Header element still open! -->
<a href="javascript:hideMenu()"class="Links" id="close">Close <b>X</b></a>
<a href="" class="Links link">About</a>
<a href="index.html" class="Links link">Home</a>
<a href="" onclick="myAccFunc()" class="Links link">Websites</a>
</aside> <!-- aside element closed -->
<main> <!-- div class="notBar" replaced with main element -->
<!-- WARNING: Header element still open! -->
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAACZSURBVGhD7djBCcJAGETh1QpiKzakxViDYCtpwSKUNKIzh9wW/pziuLwP3jFhQgzCNgAAMLijuqq7eoTlTd7mjaWb+oTnjaWn6l2clDeWhnkjB5X8jVyUNwIAsk3qFJY3bXZWi+r9oyb0Vt5YmlXvBkl5Y2mYB/Fre6neDRLytk0/rdXff+wAgJ/ggG7HOKBLiwM6AACQr7UvP+370u9envwAAAAASUVORK5CYII=" alt="Menu Bar" style="width: 35px; height: 40px;" id="menu" onclick="showMenu()"> 
<center class="center">Caleb Did This</center>
</header> <!-- Attempt to close page header with main element open... Oops! -->
<img src="https://cdn.pixabay.com/photo/2016/10/25/12/28/iceland-1768744_960_720.jpg" id="Ice">
<footer>
<p class="pmargin"><span class="gray">Created and designed by</span>
<span class="names">Caleb</span></p>
<p><span class="gray">Lots of help from my uncle</span>
<span class="names">Jonathan</span></p>
<p class="icon"><span class="gray">All Icons were made by</span></p>
<a href="https://icons8.com" class="a"><span class="names">Icons8</span></a>
</footer>
</main> <!-- Attempt to close main element although others have been closed prior to this - Oops...! -->
<script type="text/javascript" src="Caleb.js">
</script>
</body>
</html>