html - 将 <button=type> 与 .CSS 居中对齐

标签 html css

.signupH {
	background-color:#9FADBC;
	color:white;
	border-top-left-radius:10px;
	border-top-right-radius:10px;
	width:300px;
	height:18px;
	font-family:Tahoma, Geneva, sans-serif;
	font-weight:3px;
	text-align:center;
	margin-top:-10px;
	margin:auto;
	position:absolute;
	top:0;
	left:0;
	bottom:20;
	right:0;
    padding:10px;
	}

.signupback {
	background-color:#55789e;
	width:300px;
	height:210px;
    margin:auto;
	position:absolute;
	top:0;
	left:0;
	bottom:0;
	right:0;
    padding:10px;
	webkit-border-radius: 10px;
	khtml-border-radius: 10px;	
	moz-border-radius: 10px;
	border-radius: 10px;
	}
<body bgcolor="#215698">

	<div class="signupback">
	<table>
			<center><div class="signupH">
				Graphicx | Sign up
			</div></center>
		<br>
	<form role="form" action="login-post.php" method="POST">
	<table align="middle">
	<tr>
	<td>
		Username:
	</td>
	<td>
						
						<input id="username" type="text" value="username" 
						onfocus="this.value = this.value=='username'?'':this.value;" 
						onblur="this.value = this.value==''?'username':this.value;", >
						
	</td>
	</tr>
	<tr>
	<td>
		Email:
	</td>
	<td>
						<input id="email" type="text" value="email" 
						onfocus="this.value = this.value=='email'?'':this.value;" 
						onblur="this.value = this.value==''?'email':this.value;", >
	</td>
	</tr>
	<tr>
	<td>
		Password:
	</td>
	<td>
						<input id="password" type="password" value="password" 
						onfocus="this.value = this.value=='password'?'':this.value;" 
						onblur="this.value = this.value==''?'password':this.value;", >
	</td>
	</tr>
			
					<center><button type="submit" class="button">Sign up</button></center>

	</form>
	</div>
	</table>
		<br>	
				
							
</body>

该按钮位于表单顶部,我需要它位于用户名、电子邮件和密码文本字段下方。有人可以帮我解决这个错误吗?

我需要将按钮移到文本字段下方,但仍必须位于表单属性内才能将其与我的 SQL 数据库连接。

求助!!!

最佳答案

尝试将其放入另一组表格行标签中:

</td>
</tr>
<tr>
<td>        
                <center><button type="submit" class="button">Sign up</button></center>
</td>
</tr>

</form>

...或者通过给它以下属性使其成为 CSS 中的 block 元素:

style="display:block"

关于html - 将 <button=type> 与 .CSS 居中对齐,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30276829/

相关文章:

php - 将表单提交到 php 脚本需要 Javascript 吗?

javascript - 如何创建一个 JavaScript float div 注册表单

css - Prestashop 1.4.8 移动兼容性

javascript - 元素在移动设备上的位置与桌面上的不同

html - 在 Angular 中提交表单后在不同的组件中显示表单输入数据

html - 两个堆叠DIV的顶部DIV如何影响对方的高度

php - 提交表单时丢失我的 $_GET 变量

jQuery Noob,列出问题

Google App Engine 中的 HTML

c# - 最小化窗口时 Bootstrap 文本框宽度和对齐方式发生变化