如何用记事本制作一个简陋的小网页(3)——注册信息表

目录

前提须知:

一、表格建立之前:

二、表格的建立:

三、信息表的内容填充:

 1.昵称 和 电话 :

2.密码:

3.性别:

4. 爱好:

5.民族:

6. 出生日期:

7.博客网址:

8.邮箱:

9. 文件上传:

10.幸运色:

11.留言板:

12.确认按钮和重置按钮:



前提须知:

如何使用记事本制作一个简陋的小网页(2)——表格的建立-CSDN博客icon-default.png?t=N7T8https://blog.csdn.net/2301_76445610/article/details/133417340

一、表格建立之前:

在表格建立之前需要使用<form></form>以此才能将信息表内的信息进行表达。

二、表格的建立:

使用<table></table> <tr></tr> <td></td>对表格进行一个框架的完善和修补

三、信息表的内容填充:

 1.昵称 和 电话 :

  •  input 是一种表格内部语法的头部标识,而type是对这种标识的一种类型。
<input type="text" placeholder="请输入昵称" size="25" pattern="^[\u4e00-\u9fa5]{4,10}" title="输入4到10个汉字"autofocus required/>
  • text是一种文本框,二placeholder是一个灰色的提示 

  • size 是表示文本框的长度,pattern是一种规则,规则规定只能输入 4到10个汉字,而title是一种输入错误的提醒。

同样电话功能也是如此:

 

2.密码:

 password 是密码框,用来隐藏密码,同时也有着显示密码的功能,隐藏密码通常是实心圆和*

3.性别:

radio 是一种单选框,value 是一种值域的设置,name是一种域名值,属于同一组单选框的必须要相同。

同时单选框,是只能选择一个的。

4. 爱好:

在这里,我们选用checkbox 这是复选框 ,而在复选框中的name 表示的是一种排序

同理,复选框是可以进行多个选择的。

5.民族:

  • <select></select>这时一个列表元素,而name 是列表的名字
  • 如果在<select>后面加上 size 和 multilpe <select size = "5"  multilpe> 表示的是多选项列表,可以选择五个选项最多。
  • 而图中的代码则是表示下拉列表,其中的value 是表示列表中的排位 (多选项列表也是如此功能)

  

6. 出生日期:

date是一个日历表。

7.博客网址:

  • url是生成一个网址输入框,placheholder是一个提示,value是将网址的前缀打出,规定我们必须要在这个域名输入

 

8.邮箱:

email 是 生成一个E-mail 输入框,它会辨别输入的内容是否是邮箱的网址。 

9. 文件上传:

  • file 是 一个文件域,文件域可以将本地文件进行上传

10.幸运色:

  • color 是创建一个RGS的调色,不过默认是黑色。

11.留言板:

  • <textarea></textarea>是创建一个文本区域,rows 是行数,cols 是字符数也是列数。

12.确认按钮和重置按钮:

  • submit是创建一个按钮,value是为整个确认按钮命名
  • 如果,没有使用value则默认的名字是提交

而reset是一个重置内容的按钮。 

 注意这两个代码是在表格之后的!


本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/164596.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Android apkanalyzer简介

关于作者&#xff1a;CSDN内容合伙人、技术专家&#xff0c; 从零开始做日活千万级APP。 专注于分享各领域原创系列文章 &#xff0c;擅长java后端、移动开发、商业变现、人工智能等&#xff0c;希望大家多多支持。 目录 一、导读二、概览三、用法3.1 使用 Android Studio3.1.1…

Python词语转拼音

使用python写的图形汉语词语转拼音小工具 1)安装库 pip install flet 2)代码 # 声母列表 initial_consonant_list [b, p, m, f, d, t, n, l, g, k, h, j, q, x, zh, ch, sh, r,z, c, s, y, w] # 韵母列表 list_of_vowels [a, o, e, i, u, , ai, ei, ui, ao, ou, iu, ie, e…

SpringCloudSleuth异步线程支持和传递

场景 在使用Sleuth做链路跟踪时&#xff0c;默认情况下异步线程会断链&#xff0c;需要进行代码调整支持。 调整内容 方式一 使用Async实现异步线程 开启异步线程池 EnableAsync SpringBootApplication public class LizzApplication {public static void main(String[] a…

织造业的数字安全守护者:深入了解迅软DSE数据加密

客户简要介绍 某织造企业成立于2004年&#xff0c;工厂位于苏州平望&#xff0c;公司目前拥有先进纺织设备330台套和日本瑞士等前道配套设备&#xff0c;公司占地33亩、具有现代化标准厂房办公楼等3万平米。 某织造企业面料、功能性面料、新材料面料的生产商&#xff0c;公司坚…

教程更新 | 持续开源 RK3568驱动指南-驱动基础进阶篇

《iTOP-RK3568开发板驱动开发指南》手册文档更新&#xff0c;手册内容对应视频教程&#xff0c;后续资料会不断更新&#xff0c;不断完善&#xff0c;帮助用户快速入门&#xff0c;大大提升研发速度。 ✦ 第一篇 驱动基础 第1章 前言 第2章 你好&#xff01;内核源码 第3章 …

Mysql第二篇---InnoDB数据存储结构

Mysql第二篇—InnoDB数据存储结构 数据库的存储结构: 页 索引结构给我们提供了高效的索引方式, 不过索引信息以及数据记录都是保存在文件上的(innodb的ibd文件, MyISAM的MyI和MyD文件), 确切的说是存储在页结构中. 另一方面, 索引是在存储引擎中实现的, MySQL服务器上的存储引…

工业自动化编程与数字图像处理技术

工业自动化编程与数字图像处理技术 编程是计算机领域的基础技能&#xff0c;对于从事软件开发和工程的人来说至关重要。在工业自动化领域&#xff0c;C/C仍然是主流的编程语言&#xff0c;特别是用于工业界面(GUI)编程。工业界面是供车间操作员使用的&#xff0c;使用诸如Hal…

二叉树,堆排序及TopK问题

要讲二叉树的概念&#xff0c;就要先讲树的概念。 树是什么呢&#xff1f; 树其实是一种储存数据的结构&#xff0c;因为他的结构倒过来和生活中的树很相似所以才被称之为树。 这是一颗多叉树&#xff0c;从最顶端的节点可以找到下边的几个节点&#xff0c;下边的节点又可以找…

【力扣刷题】回文链表、环形链表、合并两个有序链表

&#x1f40c;个人主页&#xff1a; &#x1f40c; 叶落闲庭 &#x1f4a8;我的专栏&#xff1a;&#x1f4a8; c语言 数据结构 javaEE 操作系统 Redis 石可破也&#xff0c;而不可夺坚&#xff1b;丹可磨也&#xff0c;而不可夺赤。 刷题篇 一、回文链表1.1 题目描述1.2 思路分…

1.16.C++项目:仿muduo库实现并发服务器之HttpContext以及HttpServer模块的设计

文章目录 一、HttpContext模块二、HttpServer模块三、HttpContext模块实现思想&#xff08;一&#xff09;功能&#xff08;二&#xff09;意义&#xff08;三&#xff09;接口 四、HttpServer模块实现思想&#xff08;一&#xff09;功能&#xff08;二&#xff09;意义&#…

经典网络模型

Alexnet VGG VGG的启示 VGGNet采用了多次堆叠3x3的卷积核&#xff0c;这样做的目的是减少参数的数量。 例如&#xff0c;2个3x3的卷积核效果相当于1个5x5的卷积核效果&#xff0c;因为它们的感受野&#xff08;输入图像上映射区域的大小&#xff09;相同。但2个3x3卷积核的参数…

1024程序员狂欢节 | IT前沿技术、人工智能、数据挖掘、网络空间安全技术

一年一度的1024程序员狂欢节又到啦&#xff01;成为更卓越的自己&#xff0c;坚持阅读和学习&#xff0c;别给自己留遗憾&#xff0c;行动起来吧&#xff01; 那么&#xff0c;都有哪些好书值得入手呢&#xff1f;小编为大家整理了前沿技术、人工智能、集成电路科学与芯片技术、…

YOLOv8改进实战 | 更换主干网络Backbone之轻量化模型Efficientvit

前言 轻量化网络设计是一种针对移动设备等资源受限环境的深度学习模型设计方法。下面是一些常见的轻量化网络设计方法: 网络剪枝:移除神经网络中冗余的连接和参数,以达到模型压缩和加速的目的。分组卷积:将卷积操作分解为若干个较小的卷积操作,并将它们分别作用于输入的不…

PHP的学习入门建议

学习入门PHP的步骤如下&#xff1a; 确定学习PHP的目的和需求&#xff0c;例如是为了开发网站还是为了与数据库交互等。学习PHP的基础语法和程序结构&#xff0c;包括变量、数据类型、循环、条件等。学习PHP的面向对象编程&#xff08;OOP&#xff09;概念和技术。学习与MySQL…

BIO、NIO、IO多路复用模型详细介绍Java NIO 网络编程

文章目录 前言基本概念BIO过程NIO过程IO多路复用过程Java NIO编程Java NIO 核心概念Java NIO 示例 总结 前言 上文介绍了网络编程的基础知识&#xff0c;并基于 Java 编写了 BIO 的网络编程。我们知道 BIO 模型是存在巨大问题的&#xff0c;比如 C10K 问题&#xff0c;其本质就…

TCP/IP模型五层协议

TCP/IP模型五层协议 认识协议 约定双方进行的一种约定 协议分层 降低了学习和维护的成本&#xff08;封装&#xff09;灵活的针对这里的某一层协议进行替换 四/五层协议 五层协议的作用 应用层 应用层常见协议 应用层常见协议概览 基于TCP的协议 HTTP&#xff08;超…

腾讯云 CODING 快速应用中心,让您 10 分钟轻松玩转 AIGC

点击链接了解详情 前言 AI 时代已经到来&#xff0c;与其说这是一个技术变革&#xff0c;不如说这是对我们工作和生活方式的全面升级。很多人已经听说过 Stable Diffusion AI 绘图和 Meta 公司推出的免费大语言模型 Llama 2&#xff0c;它们代表了当今最前沿的技术水平。但对于…

1.5状态压缩DP

1.小国王 在 n n nn nn的棋盘上放 k k k个国王&#xff0c;国王可攻击相邻的 8 8 8个格子&#xff0c;求使它们无法互相攻击的方案总数。 输入格式 共一行&#xff0c;包含两个整数 n n n和 k k k。 输出格式 共一行&#xff0c;表示方案总数&#xff0c;若不能够放置则输出…

全国产EtherCAT运动控制边缘控制器(五):IO配置与回零运动的Python+Qt开发

今天&#xff0c;正运动小助手给大家分享一下全国产EtherCAT运动控制边缘控制器ZMC432H如何使用PythonQT实现单轴回零运动控制开发。 01 功能简介 全国产EtherCAT运动控制边缘控制器ZMC432H是正运动的一款软硬件全国产自主可控&#xff0c;运动控制接口兼容EtherCAT总线和脉冲…

Elasticsearch使用——结合MybatisPlus使用ES es和MySQL数据一致性 结合RabbitMQ实现解耦

前言 本篇博客是一篇elasticsearch的使用案例&#xff0c;包括结合MybatisPlus使用ES&#xff0c;如何保证MySQL和es的数据一致性&#xff0c;另外使用了RabbitMQ进行解耦&#xff0c;自定义了发消息的方法。 其他相关的Elasticsearch的文章列表如下&#xff1a; Elasticsear…