综合案例-注册页面(HTML)

最新推荐文章于 2023-03-05 14:32:20 发布
最新推荐文章于 2023-03-05 14:32:20 发布
阅读量213 收藏 2
点赞数
分类专栏： 前端 文章标签： 列表 checkbox html 网页设计 html5
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_50569789/article/details/119381950
版权

综合案例-注册页面(HTML)

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>综合案例-注册页面</title>
</head>

<body>

    <h3>青春不常在，抓紧谈念爱</h3>
    <!-- 表格域table -->
    <table width="500" border="0">
        <!-- 行：tr  列：td -->
        <!-- 第一行 -->
        <tr>
            <td>性别:</td>
            <td>
                <input type="radio" name="sex" id="nan"> <label for="nan"><img src="nan.gif"> 男 </label>
                <input type="radio" name="sex" id="nv"> <label for="nv"> <img src="nv.gif">女 </label>
            </td>
        </tr>

        <!--第二行 -->
        <tr>
            <td>生日：</td>
            <td>
                <select>
                    <option>--请选择出生年份--</option>
                    <option>1999</option>
                    <option>2000</option>
                    <option>2001</option>
                    <option>2002</option>
                    <option>2003</option>
                    <option>2004</option>
                    <option>2005</option>
                    <option>2006</option>
                    <option>2007</option>
                    <option>2008</option>
                </select>

                <select>
                    <option>--请选泽月份--</option>
                    <option>1月</option>
                    <option>2月</option>
                    <option>3月</option>
                    <option>4月</option>
                    <option>5月</option>
                    <option>6月</option>
                    <option>7月</option>
                    <option>8月</option>
                    <option>9月</option>
                    <option>10月</option>
                    <option>11月</option>
                    <option>12月</option>
                </select>

                <select>
                    <option>--请选择日--</option>
                    <option>1号</option>
                    <option>2号</option>
                    <option>3号</option>
                    <option>4号</option>
                    <option>5号</option>
                    <option>6号</option>
                    <option>7号</option>
                    <option>8号</option>
                    <option>9号</option>
                    <option>10号</option>
                    <option>11号</option>
                    <option>12号</option>
                    <option>13号</option>
                    <option>14号</option>
                    <option>15号</option>
                    <option>16号</option>
                    <option>17号</option>
                    <option>18号</option>
                    <option>19号</option>
                    <option>20号</option>
                    <option>21号</option>
                    <option>22号</option>
                    <option>23号</option>
                    <option>24号</option>
                    <option>25号</option>
                    <option>26号</option>
                    <option>27号</option>
                    <option>28号</option>
                    <option>29号</option>
                    <option>30号</option>
                    <option>31号</option>
                </select>
            </td>


        </tr>
        <!--  第三行  value为默认文字-->
        <tr>
            <td>所在地区：</td>
            <td> <input type="text" value="广东"> </td>
        </tr>

        <!-- 第四行 -->
        <tr>
            <td>婚姻状况：</td>
            <td>
                <input type="radio" name="hy" id="wei"> <label for="wei">未婚</label>
                <input type="radio" name="hy" id="yi"> <label for="yi">已婚</label>
                <input type="radio" name="hy" id="li"> <label for="li">离婚</label>
            </td>
        </tr>

        <!--第五行 -->
        <tr>
            <td>学历：</td>
            <td>
                <select>
                    <option>--请选择您的学历</option>
                    <option>小学</option>
                    <option>初中</option>
                    <option>高中</option>
                    <option>本科</option>
                    <option>研究生</option>
                    <option>硕士</option>
                    <option>博士</option>
                    <option>博士后</option>
                    <option>讲师</option>
                    <option>助教</option>
                    <option>教授</option>
                </select>
            </td>
        </tr>

        <!-- 第六行 -->
        <tr>
            <td>喜欢的类型：</td>
            <td>
                <input type="checkbox" name="love">可爱型
                <input type="checkbox" name="love">清纯型
                <input type="checkbox" name="love">御姐型
                <input type="checkbox" name="love">炫酷型
            </td>
        </tr>


        <!-- 第七行 -->
        <tr>
            <td>个人介绍：</td>
            <td>
                <textarea>请输入个人简介</textarea>
            </td>


        </tr>
        <!-- 第八行 -->
        <tr>
            <td></td>
            <td>
                <input type="submit" value="免费注册">
            </td>
        </tr>

        <!-- 第九行 -->
        <tr>
            <td></td>
            <td>
                <!-- checked="checked"为默认选择 -->
                <input type="checkbox" checked="checked"> 我同意注册条款和会员加入标准
            </td>


        </tr>
        <!-- 第十行 -->
        <tr>
            <td></td>
            <!-- #表示为空链接 -->
            <td><a href="#">我是会员，立即登陆</a></td>
        </tr>

        <!-- 第十一行 -->
        <tr>
            <td></td>
            <td>
                <h4>我承诺</h4>
                <!-- ul表示无序列表 -->
                <ul>
                    <li>年满18岁，单身</li>
                    <li>抱着严肃的态度</li>
                    <li>真诚寻找另一半</li>
                </ul>
            </td>
        </tr>
    </table>

</body>

</html>
不易撞的网名
关注
专栏目录
综合案例：注册页面（HTML）
Valentino112358的博客
09-13 243
在visual studio code中快速生成html代码。 先输入i html代码： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document&l..
HTML5+CSS3综合案例-新闻列表
m0_63171030的博客
03-10 2387
【代码】HTML5+CSS3综合案例-新闻列表。
html5 案例练习（注册页面）
baipenggui_bo
08-16 455
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>世纪佳缘</title> </head> <body> <table width="600" align="center" > <caption><h4>青春不常在，抓紧谈恋爱</h...
综合案例（注册页面）
qq_40501188的博客
10-10 370
列表：用于布局 无序列表：多个并列的，简单的无序的内容 有序列表：有顺序的，其他与无序一致 自定义标题标签：有一个小标题，里面还有多个并列内容 dl：定义列表，与dt，dd一起用，只能包含dt， ...
html注册页面综合案例（07
weixin_46370945的博客
10-05 142
注册页面 效果：
html实现简单注册页面，无功能
carrotluotian的博客
12-25 222
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>注册页面</title> </head> <body> <h4>青春不常在，抓紧谈恋爱</h4> <t...
综合案例CSS注册页面.html
01-12
综合案例CSS注册页面.html
综合案例_新闻页面.rar
05-03
文件列表中包含了一个名为“综合案例_新闻页面.html”的HTML文件，这通常是一个静态网页文件，用于展示CSS的实践效果。 首先，我们要理解CSS的基础概念。CSS是一种样式表语言，用于描述HTML或XML（包括如SVG、Math...
CSS综合案例（登录页面）
最新发布
09-28
这个资源是一个登录页面的制作，比较适合初学者，里面有图片资源、代码资源、代码里面有部分解释，不一定全，多见谅，不会的可以与我联系。大体分为几个模块： 首先是放跑车图片的模块，一共是十个盒子，需要确定好...
HTML 表格标签、列表标签、表单标签（案例： 注册页面）
酷爱前端的小陈博客
04-16 2372
1. 表格标签 表格是实际开发中非常常用的标签: 1. 表格的主要作用 2.表格的基本语法 1.1 表格的主要作用 表格主要用于显示、展示数据，因为它可以让数据显示的非常的规整，可读性非常好。特别是后台展示数据的时候，能够熟练运用表格就显得很重要。一个清爽简约的表格能够把繁杂的数据表现得很有条理。 总结: 表格不是用来布局页面的,而是用来展示数据的。 1.2 表格的基本语法 1. <table> </table> 是用于定义表格的标签。 2. &...
HTML 使用表单标签实现注册页面的实例代码
12-14
案例说明：　　　   　　　　- 使用表格实现页面效果  　　　　- 超链接不想要有效果，使用href="#" 　　　　- 如果表格里面的单元格没有内容，使用空格作为占位符   　　　　- 使用图片标签提交表单 <input type="image" src="图片的路径"/>   完整代码：   <html> <head> <title>World</title> </head> <body> <form action="01-hello.html" method="post"> <h3 align=
综合案例-页面注册
m0_55879104的博客
04-25 204
<title>世纪佳缘-你在我也在</title> <style> tr { height: 30px; } </style> </head> <body> <!-- cellspacing：设置单元格与单元格边框之间的空白间隙 cellpadding：设置单元格内容与单元格边框之间的空白间隙 --> <ta.
html-综合案例之注册页面
m0_53163148的博客
09-17 831
2.< lable >中添加for属性，< input >中添加id属性，将两个标签形成联系。页面布局分为上下两大部分，上面用标题标签，下面用表格标签，行标签和单元格标签。1.在单选按钮中，使用< lable >标签，可以增强用户体验。1.在单选按钮中，使用< lable >标签，可以增强用户体验。1.设置默认选中选项，在< input >标签中设置属性。右边为文本框(value设置默认值)右边是表单元素中的单选按钮。（以此类推）总共十一行。
前端与移动开发-----HTML综合案例：注册页面
東三城的博客
10-13 512
注册页面 综合案例主要练习所学标签: 表格标签, 可以让内容排列整齐. 列表标签 表单标签 综合案例效果图： 综合案例页面分析： 标题：青春不常在，抓紧谈恋爱； 表单：负责收集汇总用户输入信息； 表格：让表单内的内容排列得更整齐 左侧单元格：显示提示信息； 右侧单元格：显示表单元素，供用户输入或选择信息； 无序列表：在表格末尾显示我承诺。 综合案例实现 准备工作 将图片素材右边保存至 images 目录下，并分别重命名为 man.jpg 和 women.jpg ： 新建综合案例.html 并
HTML注册页面案例
weixin_46441425的博客
02-10 314
html案例：注册页面
dianziagen的博客
03-05 1210
效果： 关注点： （1）如果单元格里面没有内容，使用占位符替代（使用空格） （2）想要一个超链接没有效果，在href属性值写成# 代码： html示例 免费开通黑马账号 注册邮箱： 使用手机号或者账号注册 创建密码： 真实姓名： 性别： 女 男
HTML--注册页面案例
hx1043116928的博客
09-29 491
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> </head> <body> <!--表里标签：action:提交的地址 ...
web前端学习55-58（综合案例-注册页面）
weixin_51249285的博客
11-09 854
综合案例-注册页面（1） 基本框架，后续需调整格式等细节 eg: 综合案例-注册页面1.html <!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-w
HTML综合案例——注册页面
榕城候佳人的博客
03-05 676
🌟所属专栏：前端只因变凤凰之路🐔作者简介：rchjr——五带信管菜只因一枚😮前言：该系列将持续更新前端的相关学习笔记，欢迎和我一样的小白订阅，一起学习共同进步~👉文章简介：本文介绍一个HTML综合案例，将综合运用之前所学的表单、表格、列表、input输入元素、select选择元素、复选框等等构建一个注册页面，知识学习内容来自b站的@黑马程序员的视频😃。
HTML综合案例实战详解及代码注释
资源摘要信息:"综合案例实战_biaomingb_" HTML是一种用于创建网页的标准标记语言，它使用一系列的标签来定义网页内容的结构和格式。标签通常在尖括号中书写，例如`<html>`、`<head>`和`<body>`等，这些标签构成了...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

不易撞的网名

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值