html:表

时间:2015-08-03 10:25:46

标签: html jsp

我正在尝试编写一个显示表单错误的jsp,但我似乎无法正确格式化它。我试图在其中一个单元格中添加一个表格,这使得它看起来更好一点,但它仍然看起来不干净。这是我的代码。



<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
	pageEncoding="ISO-8859-1"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>New user account</title>
</head>
<body>

	<h1 align="center">Sign Up</h1>
	<h3 align="center">Please fill in the following form to create
		your account.</h3>
	<form action="SignupCheck" method="post">
		<table border="1" align=center width="500">
			<tr>
				<td width="250"><p align="center">Full Legal Name:</p></td>
				<td align="center"><input type="text" name="name"></td>
			</tr>
			<tr>
				<td width="250"><p align="center">Username:</p>
				<td align="center"><input type="text" name="username"></td>
			</tr>
			<tr>
				<td width="250"><p align="center">Password:</p></td>
				<td align="center"><input type="password" name="password"></td>
			</tr>
			<tr>
				<td width="250"><p align="center">Confirm Password:</p></td>
				<td align="center"><input type="password"
					name="confirmPassword"></td>
			</tr>
			<tr>
				<td width="250"><p align="center">Starting Balance:</p></td>
				<td>
					<table align="center">
						<tr>
							<td align="center"><input type="text" name="balance"></td>

						</tr>
						<tr>
							<td align="center"><p align="center"
									style="color: red; font-size: 18px">Please enter your
									password</p></td>
						</tr>
					</table>
				</td>
			</tr>
			<tr>
				<td width="250" align="right"><input type="reset" value="Reset"></td>
				<td align="left"><input type="submit" value="Submit"></td>
			</tr>
		</table>
	</form>
</body>
</html>
&#13;
&#13;
&#13;

如您所见,我发出了一个示例错误并且文本框太高而且错误消息占用了太多空间......

1 个答案:

答案 0 :(得分:0)

将以下内容添加为CSS:

td {
    padding: 5px 5px 5px 5px
}
p {
    text-align:right;
}
table {
    border: solid lightgray;
    border-radius: 10px;
}

Here is the JSFiddle demo

另请注意,我修改了HTML代码,删除了您添加的子表。请查看JSFiddle以获取完整代码。