我想在页面中添加第三列，但不确定在不编辑当前代码的情况下如何做。有办法吗？
（对于那些面对面的人，我真的不是最擅长编码的人）。
这是我当前的代码：
#header {
background-color: black;
color: white;
text-align: center;
padding: 5px;
}
#nav {
line-height: 30px;
background-color: #eeeeee;
height: 300px;
width: 100px;
float: left;
padding: 5px;
}
#section {
width: 350px;
float: left;
padding: 10px;
}
#footer {
background-color: black;
color: white;
clear: both;
text-align: center;
padding: 5px;
}
#aside {
width: 350px;
float: right;
padding: 10px;
}<div id="header">
<u><h1 style="font-family:sans-serif; text-align:center">Search Engines</h1></u>
</div>
<div id="nav">
<a href="http://www.excite.co.uk/">Excite</a>
<br>
<a href="http://www.google.co.uk/">Google</a>
<br>
<a href="http://www.yahoo.co.uk/">Yahoo</a>
<br>
<a href="http://www.bing.co.uk/">Bing</a>
<br>
<a href="http://www.askjeeves.co.uk/">AskJeeves</a>
<br>
<a href="http://www.duckduckgo.com/">DuckDuckGo</a>
<br>
<a href="http://www.aol.co.uk/">Aol</a>
<br>
<a href="http://www.wolframalpha.co.uk/">Wolfram Alpha</a>
<br>
<a href="http://www.overture.com/">Overture</a>
<br>
</div>
<div id="section">
<u><h2 style="font-family:sans-serif; text-align:center">What is a Search Engine?</h2></u>
<p style="font-family:sans-serif; text-align:center">
Search engines are special websites that have indexed billions of pages - and make it easy for you to find a website or page in an instant. Popular search engines include Google, Yahoo!, Bing and Ask.
<p style="font-family:sans-serif; text-align:center">
To get to a search engine you just need to go to your browser's address bar and type in the address of the search engine website, or you can use the search box that's usually found in the top right-hand corner of a browser.
</p>
</div>
<div id="aside">
<u><h2 style="font-family:sans-serif; text-align:center">How do Search Engines Work?</h2></u>
<p style="font-family:sans-serif; text-align:center">Each search engine works in a similar way. If you go to a search engine's homepage, you'll find a single box. You simply type whatever you want to search for into that box.</p>
</div>
<div id="footer">
Zoe is a fabulous human being.
</div>最佳答案
这是将其更改为三列的方法。
我已经修改了您的代码。
我已经删除了#section和#aside的css。
我已经为#nav修改了一些CSS属性
我创建了一个名为.column的CSS类，该类应用于您的＃section /＃aside和我创建的第三列。
HTML：
<div id="header">
<u><h1 style="font-family:sans-serif; text-align:center">Search Engines</h1><u>
</div>
<div id="nav">
<a href="http://www.excite.co.uk/">Excite</a><br>
<a href="http://www.google.co.uk/">Google</a><br>
<a href="http://www.yahoo.co.uk/">Yahoo</a><br>
<a href="http://www.bing.co.uk/">Bing</a><br>
<a href="http://www.askjeeves.co.uk/">AskJeeves</a><br>
<a href="http://www.duckduckgo.com/">DuckDuckGo</a><br>
<a href="http://www.aol.co.uk/">Aol</a><br>
<a href="http://www.wolframalpha.co.uk/">Wolfram Alpha</a><br>
<a href="http://www.overture.com/">Overture</a><br>
</div>
<div class="column">
<u><h2 style="font-family:sans-serif; text-align:center">First Column</h2></u>
<p style="font-family:sans-serif; text-align:center">
Search engines are special websites that have indexed billions of pages - and make it easy for you to find a website or page in an instant.
Popular search engines include Google, Yahoo!, Bing and Ask.
<p style="font-family:sans-serif; text-align:center">
To get to a search engine you just need to go to your browser's address bar and type in the address of the search engine website,
or you can use the search box that's usually found in the top right-hand corner of a browser.
</p>
</div>
<div class="column">
<u><h2 style="font-family:sans-serif; text-align:center">Second Column</h2></u>
<p style="font-family:sans-serif; text-align:center">Each search engine works in a similar way. If you go to a search engine's homepage,
you'll find a single box. You simply type whatever you want to search for into that box.</p>
</div>
<div class="column">
<u><h2 style="font-family:sans-serif; text-align:center">Third Column</h2></u>
<p style="font-family:sans-serif; text-align:center">Each search engine works in a similar way. If you go to a search engine's homepage,
you'll find a single box. You simply type whatever you want to search for into that box.</p>
</div>
<div id="footer">
Zoe is a fabulous human being.
</div>
CSS：
#header {
background-color:black;
color:white;
text-align:center;
padding:5px;
}
#nav {
line-height:30px;
background-color:#eeeeee;
height:300px;
float:left;
padding:5px;
box-sizing:border-box;
width:10%;
}
#footer {
background-color:black;
color:white;
clear:both;
text-align:center;
padding:5px;
}
.column{
box-sizing:border-box;
width: 30%;
float:left;
padding: 10px;
}
这是codepen示例：http://codepen.io/anon/pen/GgEmwJ
编辑：此解决方案是一个简短的解决方案，它不适合非常小的屏幕尺寸。您可以尝试调整浏览器的宽度；您会注意到，如果浏览器的宽度太小，则导航栏的宽度可能不足以容纳其内容。
这是您可能要调查媒体查询并为小视口定义另一组CSS规则的时候
关于html - 如何在当前代码中添加第三列？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/28120241/