将HTML页面分成两个或多个部分
如何将网页分成两个或更多部分？例如，我想在左边放一些图片，在右边放一张联系表。我找不到办法来做这件事。我试着用div来做，但没用。下面是我试图做的一个示例代码将HTML页面分成两个或多个部分,html,Html,如何将网页分成两个或更多部分？例如，我想在左边放一些图片，在右边放一张联系表。我找不到办法来做这件事。我试着用div来做，但没用。下面是我试图做的一个示例代码 <html> <head> <title>Test</title> </head> <body> <div class="page"> <div class="header">
<html>
<head>
<title>Test</title>
</head>
<body>
<div class="page">
<div class="header">
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="about.html">About</a></li>
<li><a href="projects.html">Projects</a></li>
<li class="selected"><a href="contact.html">Contact</a></li>
</ul>
</div>
<div class="body">
<div id="pictures">
<h1>Picture</h1>
</div>
<div id="contacform">
<h1>
<form action="mail.php" method="POST">
<p>Name</p> <input type="text" name="name">
<p>Email</p> <input type="text" name="email">
<p>Message</p><textarea name="message" rows="6" cols="25"></textarea><br />
<input type="submit" value="Send"><input type="reset" value="Clear">
</form>
</h1>
</div>
</div>
<div class="footer">
<p>Test Footer</p>
</div>
</div>
</body>
试验
图画
姓名
电子邮件
消息
测试页脚
我不打算将您应该使用的所有CSS分开，因此下面的代码示例将向您展示如何将两个div标记平均分开。请不要在css中使用#id选择器，因为它会杀死小猫 您的HTML：
<div class="body">
<div id="pictures" class="column half>
<h1>Picture</h1>
</div>
<div id="contactform" class="column last>
<h1>
<form action="mail.php" method="POST">
<p>Name</p> <input type="text" name="name">
<p>Email</p> <input type="text" name="email">
<p>Message</p><textarea name="message" rows="6" cols="25"></textarea><br />
<input type="submit" value="Send"><input type="reset" value="Clear">
</form>
</h1>
</div>
</div>
我建议您阅读CSS网格系统。请展示一些您迄今为止尝试过的代码。我用这些代码更新了描述。
.body { overflow: hidden; }
.column { float: left; }
.half { width: 50%; }
.last { float: none; width: auto; }