0
点赞
收藏
分享

微信扫一扫

【前端】利用HTML标签 实现简单用户登录界面 表单<form> <input>【HTML+CSS+JavaScript(JS)】

先峰老师 2022-02-11 阅读 130

效果:

在这里插入图片描述

代码:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>登录页面</title>
	</head>
	<body>
		<form><!--注意需要用table-->
			<table align="center" width="512" style="border:1px solid;">
				<tr>
					<th align="center" colspan="2">
						<h1>管理员登陆</h1><!--h/p标签自动换行换段-->
					</th>
				</tr>
				
				<tr>
					<td align="center">登录名:</td>
					<td><input type="text" value="请输入用户名"></td>
				</tr>
				
				<tr>
					<td align="center">&nbsp;&nbsp;&nbsp;码:</td>
					<td><input type="password" ></td>
				</tr>
				
				<tr>
					<td align="center"><input type="checkbox" value="1" checked>记住密码</td>
					<td align="center"><a href="">忘记密码</a></td>
				</tr>
				
				<tr>
					<td align="center" width="50%"><input type="submit" value="登录"/></td>
					<td align="center" width="50%"><input type="reset" value="重置" /></td>
				</tr>
				
				<tr colspan="2">
					<td>
						<br/>
					</td>
				</tr>
				
			</table>
		</form>
	</body>
</html>

注意:

h/p标签自动换行换段
举报

相关推荐

0 条评论