html个人信息采集表格的简单使用

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>个人信息填表</title>
</head>
<!-- 

表单标签:表单标签的作用是用于提交数据给服务器.
表单标签是form标签

action:该属性是用于指定提交数据的地址.
method:指定表单提交方式:
get:默认使用的提交方式.提交的数据会显示在地址栏上
post:提交数据是不会显示在地址栏.
注意:表单的数据如果需要提交到服务器上面,那么表单必须要有那么的属性值


-->
<body>
<form action="http://www.baidu.com" method ="post">
<table align="center" border = "1px" bordercolor="#0000FF" width="400px" height="500" cellpadding="0" cellspacing="0">
<caption><font size="+1" color="#FF9966" >个人信息收集表</font></caption>
<tbody>
<tr>
<th>用户名:</th>
<th><input type="text" name="userName"/></th>
</tr>
<tr>
<th>密码:</th>
<th><input type="password" name="passWord"/></th>
</tr>
<tr>
<th>性别</th>
<th>男<input type="radio" name="sex" checked = "true" value ="men"/> 女<input type="radio" name="sex" checked = "true" value ="woman"/> </th>
</tr>
<tr>
<th>爱好</th>
<th>电影<input name = "hobit" type = "checkbox" value="电影" /> 游戏<input name = "hobit" type = "checkbox" value="游戏" />小说<input name = "hobit" type = "checkbox" value="小说" /></th>
</tr>
<tr>
<th>城市</th>
<th><select name ="city">
<option value="bj">北京</option>
<option value="gx">广西</option>
<option value="xy">新余</option>
<option value="sz">深圳</option>
<option value="sd">山东</option></select>
</th></tr>
<tr>
<th>照骗</th>
<th><input type="file" name="image"/></th></tr>
<tr>
<th>个人简介</th>
<th><textarea name="文本域" rows="10" cols="30" ></textarea></th></tr>
<tr>
<th colspan="2" align="center" >
<input type="submit" value="提交"/>
<input type="reset" value="重置"/>
</th>
</tr >


</tbody>
</table>
</form>
</body>
</html>
HTML学生信息管理系统只用前端的实现是完全可行的。前端主要负责展示数据和用户交互,通过HTML、CSS和JavaScript来完成页面设计、样式美化和功能实现。 首先,利用HTML标签和属性可以构建学生信息管理系统的各个页面。例如,使用<div>、<table>、<form>等标签来创建页面的整体结构和布局,使用<input>、<select>、<textarea>等标签来实现输入框、下拉列表和文本表单元素。这样,可以通过HTML语法将学生的个人信息和相关操作展示在页面上。 其次,使用CSS可以美化学生信息管理系统的界面。通过定义样式表,我们可以设置页面的颜色、字体、大小、边距等属性,从而使系统界面看起来更加美观。同时,利用CSS的选择器可以实现表格的斑马线效果、按钮的悬停和点击效果等,增强用户的视觉体验。 最后,通过编写JavaScript代码可以实现学生信息管理系统的各种交互功能。例如,可以利用DOM操作获取用户输入的信息并进行表单验证,确保数据的正确性。同时,可以使用事件处理函数来响应用户的操作,比如添加学生信息、删除学生信息和修改学生信息等。此外,还可以通过JavaScript发送Ajax请求与后台进行数据交互,实现学生信息的增删改查等功能。 综上所述,利用HTML、CSS和JavaScript可以实现一个基本的学生信息管理系统的前端部分。当然,这只是一个简单的例子,实际项目中可能还需要其他技术的配合,如数据库和服务器端编程等。但在只用前端的情况下,我们可以通过这些前端技术来搭建一个简单、可交互的学生信息管理系统。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值