在一個HTML文件中顯示兩個表格

Question

我想更改我的網站的登錄頁面。

我需要在登錄頁面上添加一個註冊表單，這樣該頁面將有兩種形式：一種用於登錄，另一種用於註冊。

我不知道如何水平設置這些形式。任何人都可以解釋如何做到這一點？

Answer 1

你需要做什麼這應該給你的一個想法：

HTML：

<div class="container"> 
    <div class="form form1">Form 1</div> 
    <div class="form form2">Form 2</div> 
</div> 

CSS：

.container { 
    width:100%; 
    overflow:auto; 
} 

.form { 
    width:50%; 
    height:100px; 
    float:left; 
} 

.form1 { 
    background:#ccc; 
} 

.form2 { 
    background:#999; 
} 

現場演示：​​

Answer 2

使用float:left：

HTML：

<form> 
    <input type="text" /> 
    <input type="text" /> 
    <input type="submit" /> 
</form> 
<form> 
    <input type="text" /> 
    <input type="text" /> 
    <input type="submit" /> 
</form> 

CSS：

input { display: block; } 
form { float: left; padding-left: 15px; } 

現場演示：Tinkerbin

Answer 3

你有可能把這些表單放入div中嗎？

HTML：

<div class="left">LEFT FORM</div> 
<div class="right">RIGHT FORM</div> 
<div class="clear"></div> 

CSS：

.left { 
    float:left; 
    width:300px; 
} 
.right { 
    width:300px; 
} 
.clear { 
    clear:left; 
}