案例效果图
以上界面的完整代码
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body><h1 align="center">用户注册</h1><p align="center">用户名:<input type="text"></p><p align="center">密码:<input type="password" autofocus></p><p align="center">请输入你的性别:<input type="radio" name="1">男<input type="radio" name="1">女</p><!-- 以上radio类型的按钮要取名字为一样的,不然不仅可以同时选,而且还取消不了 --><p align="center">请选择你的爱好:<input type="checkbox">lol<input type="checkbox">王者荣耀<input type="checkbox">刷抖音<input type="checkbox">看韩剧<input type="checkbox">吃美食</p><p align="center">请输入你的邮箱:<input type="email" value="请输入你的邮箱:"></p><p align="center">请选择你的用户头像:<input type="file" ></p><p align="center">请选择家庭住址:<select name="" id=""><option value="" checked>重庆</option><option value="">福建</option><option value="">贵州</option><option value="">海南</option></select></p><p align="center">请选择你的收货地址:<select name="请选择你的收货地址:" id="" multiple><option value="" >重庆</option><option value="">福建</option><option value="">贵州</option><option value="">海南</option><option value="">重庆</option><option value="">福建</option><option value="">贵州</option><option value="">海南</option></select></p><p align="center">您的意见是:<textarea name="" id="" cols="30" rows="10">请输入你的意见</textarea></p><p align="center">您喜欢的颜色是:<input type="color"></p><p align="center">您注册的时间是:<input type="datetime-local"></p><p align="center"><input type="submit" value="注册"><input type="reset" value="重置"></p></body>
</html>
跳转
<form action="https://www.baidu.com/"method="post"name="register">用户名:<input type="text"name="username"><br>密码:<input type="password"name="password"><br><input type="submit"value="登入"></form>
点击登入按钮后会根据action中填写的相关路径跳转。