HTML5网页前端设计中如下图表单的代码怎么写?

HTML5网页前端设计中如下图表单的代码怎么写?,第1张

下面是表单代码,你直接再加属性就可以了,表单用 table 写比较简单,div 太麻烦了;

<html xmlns=" http://www.dayinmandarin.com ">

<head>

<meta http-equiv="Content-Type" content="text/htmlcharset=utf-8" />

<title>黑板</title>

</head>

<body>

<div style="width:500px">

<h1 style="width:500pxheight:50pxcolor:#2A8DF0border-bottom:#2A8DF0 solid 3pxtext-align:center">用户注册页面</h1>

<table cellpadding="0" cellspacing="10" style="margin:0 auto">

<tr>

<td align="right" valign="top"><div>用户名:</div></td>

<td><input style='width:250px' value='请输入用户名' /></td>

</tr>

<tr>

<td align="right" valign="top"><div>密 码:</div></td>

<td><input style='width:250px' value='请输入密码' /></td>

</tr>

<tr>

<td align="right" valign="top"><div>确 认:</div></td>

<td><input style='width:250px' value='请再次输入密码' /></td>

</tr>

<tr>

<td align="right" valign="top"><div>姓 名:</div></td>

<td><input style='width:250px' value='请输入真实姓名' /></td>

</tr>

<tr>

<td align="right" valign="top"><div>邮 箱:</div></td>

<td><input style='width:250px' value='请输入电子邮箱' /></td>

</tr>

</table>

<div align="center"><input style="width:100pxheight:30pxtext-align:centerline-height:30pxbackground:#2289F0border:#2289F0color:whitefont-weight:boldfont-size:16px" type="submit" value="提交注册" /></div>

</div>

</body>

</html>

HTML5中表单验证有如下好处:

1、可判断用户是否已填写表单中的必填项目。

2、可判断用户输入的邮件地址是否合法。

3、可判断用户是否已输入合法的日期。

4、可判断用户是否在数据域(numeric field)中输入了文本。

表单验证通常采用策略模式的思想,把一个个验证规则封装成一个函数,比如非空规则、最大长度规则等,不同的输入框选择某一个或者某几个规则进行验证。

扩展资料:

HTML表单一直都是Web的核心技术之一,有了它才能在Web上进行各种各样的应用。HTML5 Forms新增了许多新控件及其API,方便做更复杂的应用,而不用借助其它Javascript框架。

表单有以下几个基本知识点:

1、表单仍是以<form>元素作为容器,可在其中设置基本的提交特性。

2、当用户提交页面时,表单仍然向服务器发送表单控件的值。

3、之前老版本中的表单控件,如text radio checkbox等等,都可以按原有方式使用,尽管增加了新的功能。

4、仍然可以使用javascript *** 作表单控件。


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/zaji/7319508.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-04-04
下一篇 2023-04-04

发表评论

登录后才能评论

评论列表(0条)

保存