HTML实例之注册页面

最新推荐文章于 2024-06-05 13:34:25 发布
最新推荐文章于 2024-06-05 13:34:25 发布
阅读量285 收藏
点赞数 1
文章标签： html javascript css
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_73884252/article/details/130726617
版权

源代码： 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
h4{
    line-height: 5px;
}
form {
  display: flex;
  flex-direction: column;
}

label {
  display: flex;
  align-items: center;
}
label span {
  margin-right: 30px;
}
label input,
label select,
label textarea {
  margin-left: 5px;
}
div{
    float: right;
}
.box{
   margin: 0 auto;
}
    </style>
</head>
<body>
    <div >
    <img src="https://qlogo4.store.qq.com/qzone/2653145940/2653145940/100?1670486659" alt="">
    </div>
    <div>
<h4>青春不常在，抓紧谈恋爱</h4>
<br>
<form action="注册页面">
<label> 
    <span>性别&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;</span> 
<input type="radio" name="sex"alue="male">男
<input type="radio" name="sex"value="female">女
</label>
<br>
<label>
    <span>生日&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span>
    <select name="年" id="">
<option value="" >--请选择年--</option>
<option value="">2001</option>
<option value="">2002</option>
<option value="">2003</option>
<option value="">2004</option>
<option value="">2005</option>
</select>
<select name="月" id="">>
<option value="" >--请选择月--</option>
<option value="">1</option>
<option value="">2</option>
<option value="">3</option>
<option value="">4</option>
<option value="">5</option>
<option value="">6</option>
<option value="">7</option>
<option value="">8</option>
<option value="">9</option>
<option value="">10</option>
<option value="">11</option>
<option value="">12</option>
</select>
<select name="日" id="">>
<option value="" >--请选择日--</option>
<option value="">1</option>
<option value="">2</option>
<option value="">3</option>
<option value="">4</option>
<option value="">5</option>
<option value="">6</option>
<option value="">7</option>
<option value="">8</option>
<option value="">9</option>
<option value="">10</option>
<option value="">11</option>
<option value="">12</option>
<option value="">13</option>
<option value="">14</option>
<option value="">15</option>
<option value="">16</option>
<option value="">17</option>
<option value="">18</option>
<option value="">19</option>
<option value="">20</option>
<option value="">21</option>
<option value="">22</option>
<option value="">23</option>
<option value="">24</option>
<option value="">25</option>
<option value="">26</option>
<option value="">27</option>
<option value="">28</option>
<option value="">29</option>
<option value="">30</option>
<option value="">31</option>
</select>
</label>
<br>
<label>
<span>所在地区&nbsp;&nbsp;</span>
<input type="text"  name="location" placeholder="北京思密达">
</label>
<br>
<label>
<span>婚姻状况&nbsp;&nbsp;&nbsp;</span> 
 <input type="radio" name="marriage" value="unmarried">未婚
<input type="radio" name="marriage" value="married">已婚
<input type="radio" name="divorced" value="divorced">离婚
</label>
<br>
<label >
<span>学历&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>
    <input type="text"  name="education" placeholder="幼儿园">
</label>
<br>
<label>
<span>喜欢的类型</span>
 <input type="radio">妩媚的<input type="radio">可爱的
<input type="radio">小鲜肉<input type="radio">老腊肉<input type="radio">都喜欢
</label>
<br>
<label >
<span>自我介绍&nbsp;&nbsp;&nbsp;</span>
 <textarea name="introduceyourself" cols="18" rows="3" placeholder="自我介绍">
</textarea>
</label>
<br>
<div style="clear:both;"></div>
<div class="box">
&nbsp;<input type="button" value="免费注册">
<br>
<input type="radio" checked>我同意注册条款和会员加入标准
<br>
&nbsp;<a href="#">我是会员，立即登录</a>
<br>
<h3>我承诺</h3>
<ul>
    <li>年满18岁、单身</li>
    <li>抱着严肃的态度</li>
    <li>真诚寻找另一半</li>
</ul>
</div>
</form>
</div>
</body>
</html>

效果图 ：

 

#幻
关注
  • 1
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
HTML网页设计基础——用户注册界面
m0_64365419的博客
11-05 9686
定义表格---->将网页中的表单元素根据上图所示放入不同的行和列中。代码如下： 该实例包含的行和单元格的个数比较多，在书写代码的时候注意不要漏写，可以使用空格隔开，以便于检查。表格后几行的第一个单元格是没有内容的，虽然没有内容，但是还是需要定义空格单元格，这样才能保证和要求的表格一致。
登录注册页面 html源码.zip
11-20
在本资源"登录注册页面 html源码.zip"中，包含了一套完整的登录和注册界面的HTML源代码，这对于初学者或开发者来说，是一个很好的学习和参考实例。下面我们将深入探讨HTML在构建登录注册页面中的关键知识点。 首先...
HTML实现用户注册页面
qq_64314976的博客
07-14 3万+
HTML实现用户注册页面
HTML实现简单的注册页面
oiadkt的博客
03-07 6229
使用HTML实现一个简单的注册页面
使用HTML、CSS和JavaScript编写一个注册界面（一）
最新发布
阿常的博客
06-05 638
使用HTML、CSS和JavaScript编写一个注册界面（一），本篇文章先完成了HTML和CSS部分
用html+css制作简单好看的登陆注册界面
小袁同学的博客
07-19 6万+
注重版权，转载请注明原作者和原文链接 作者：Bald programmer 先看看效果图 login.html代码 <html> <head> <meta charset="utf-8" /> <title></title> <link rel="stylesheet" href="css/style.css" /> </head> <style> body{ .
HTML实现页面注册
qq_42978535的博客
02-01 4万+
网页版，注册页面 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>注册页面</title> <!-- 引入格式文件--> <link rel="stylesheet" href="html&css.css"> </head> <body> <sty
HTML 使用表单标签实现注册页面的实例代码
09-22
主要介绍了HTML 使用表单标签实现注册页面的实例代码,需要的朋友可以参考下
html注册登录页面精简版.zip
01-25
HTML是HyperText Markup Language的缩写，是一种用于创建网页的标准标记语言。...通过这个简单的实例，你可以加深对HTML表单、输入类型、事件处理等基础知识的理解，为进一步学习前端开发打下基础。
JavaScript 完成注册页面表单校验的实例
10-19
本实例主要介绍如何使用JavaScript来完成一个注册页面的表单校验。 首先，我们需要了解表单验证的基本流程： 1. **确定事件(onsubmit)**: 在HTML的标签中，我们可以设置`onsubmit`事件监听器，当用户尝试提交表单...
HTML实现简单注册登录页面
m0_57714421的博客
12-21 1万+
HTML实现注册登录
【Java 进阶篇】创建 HTML 注册页面
繁依Fanyi的博客
10-09 1736
通过本博客，我们学习了如何创建一个简单的HTML注册页面，包括表单元素、标签、输入字段和提交按钮。我们还了解了一些用于验证用户提交数据的常见技巧和最佳实践。最后，我们强调了表单处理后的成功页面和错误处理的重要性，以提供良好的用户体验。创建注册页面是HTML表单的基础，这个例子可以扩展到更复杂的表单和应用中，以满足不同的需求。希望这个博客对于初学者能够提供有关HTML表单的清晰概念和起点。
【HTML练习】登录注册界面模板1
coding加油站
08-04 9685
登录注册界面
HTML案例之注册页面
rihjyy的博客
02-07 1万+
HTML案例之注册页面 经过前面的学习，我们已经学了很多的标签和语法了，HTML的学习即将告一段落，我们一起来做一个综合的练习：做一个简单的小说网站的注册页面。 废话不多说，直接上代码： <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
html写一个登录注册页面
liulang68的博客
04-07 8133
【代码】html写一个登录注册页面。
HTML实现登录注册界面
m0_74135466的博客
11-01 5029
【代码】HTML实现登录注册界面。
【html+css】html登录注册页面
陈俊卓的博客
07-08 2万+
html页面登录注册代码，包含css样式
登录注册HTML页面代码
热门推荐
zhaochongsi的博客
01-06 8万+
一、注册 创建register.html文件，录入如下代码 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> form { width:100%;
【Web前端】千年之恋注册页面——源代码展示
Brant_zero的博客
06-25 1万+
本篇文章我们来实现一个千年之恋的登录注册页面(仅使用了HTML+CSS)，这个案例充分使用到了表单标签，这对于刚学习表单标签的朋友练习难度刚刚好，接下来我们来看看如何实现这个页面的效果吧。(需要源码和素材的直接私聊我) ​​​​​​...
实例化注册页面的代码python
02-16
当你想要实例化一个注册页面时，你可以使用Python的Web框架来创建一个基本的注册页面。下面是一个使用Flask框架的示例代码： ```python from flask import Flask, render_template, request app = Flask(__name__)...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值