欢迎来到尧图网

客户服务 关于我们

您的位置:首页 > 文旅 > 旅游 > 一文清晰了解表格表单

一文清晰了解表格表单

2024/10/24 15:26:50 来源:https://blog.csdn.net/weixin_73074505/article/details/140346718  浏览:    关键词:一文清晰了解表格表单

 一、表格

要想实现下述内容: 

代码如下:

<!DOCTYPE html>
<html lang="en"><head><meta charset="GBK"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head><body><table border="1px" cellspacing="0" width="600px"><tr><th>ID</th><th>Logo</th><th>name</th><th>names</th></tr><tr><td> <img src="http://gips3.baidu.com/it/u=1821127123,1149655687&fm=3028&app=3028&f=JPEG&fmt=auto?w=720&h=1280" width="100px"></td><td>这是普通</td><td>的表格内容</td><td style="text-align: center">居中</td></tr></table>
</body></html>

二、表单

要想实现下述表单: 

 

HTML代码:

<!DOCTYPE html>
<html lang="en">
<head><meta charset="GBK"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body><!-- form表单标签:action:表单提交的url,默认当前页面method:提交方式——get在url后拼接数据——post在消息体中传递,无大小限制 --><!-- name属性是必须,否则无法提交 --><form action="" method="post">用户名:<input type="text" name="username"><br><br>学号:<input type="text" name="age"><br><br>密码:<input type="password" name="password"><br><br>性别:<label><input type="radio" name="gender" value="1">男</label><label><input type="radio" name="gender" value="2">女</label><br><br>爱好:<label> <input type="checkbox" name="habby" value="java">java</label><label> <input type="checkbox" name="habby" value="C++">C++</label><label> <input type="checkbox" name="habby" value="python">python</label><br><br>生日:<input type="date" name="bir"><br><br>时间:<input type="time" name="time"><br><br>日期时间:<input type="datetime-local" name="datatime"><br><br>邮箱:<input type="email" name="email"><br><br>年龄:<input type="number" name="age"><br><br>学历:<select name="degree"><option value="">--------请选择--------</option><option value="1">大专</option><option value="2">本科</option><option value="3">硕士</option><option value="4">博士</option></select><br><br>描述:<textarea name="description" cols="30" rows="10"></textarea> <br><br><input type="hidden" name="id" value="1"><input type="button" value="按钮"><input type="reset" value="重置"><input type="submit" value="提交"><br></form>
</body>
</html>

版权声明:

本网仅为发布的内容提供存储空间,不对发表、转载的内容提供任何形式的保证。凡本网注明“来源:XXX网络”的作品,均转载自其它媒体,著作权归作者所有,商业转载请联系作者获得授权,非商业转载请注明出处。

我们尊重并感谢每一位作者,均已注明文章来源和作者。如因作品内容、版权或其它问题,请及时与我们联系,联系邮箱:809451989@qq.com,投稿邮箱:809451989@qq.com