【HTML5】html5开篇基础(5)

11,262次阅读
没有评论

共计 1841 个字符,预计需要花费 5 分钟才能阅读完成。

1.❤️❤️前言~🥳🎉🎉🎉

Hello, Hello~ 亲爱的朋友们👋👋,这里是 E 绵绵呀✍️✍️。

如果你喜欢这篇文章,请别吝啬你的点赞❤️❤️和收藏📖📖。如果你对我的内容感兴趣,记得关注我👀👀以便不错过每一篇精彩。

当然,如果在阅读中发现任何问题或疑问,我非常欢迎你在评论区留言指正🗨️🗨️。让我们共同努力,一起进步!

加油,一起 CHIN UP!💪💪

【HTML5】html5 开篇基础(5)

🔗个人主页: E 绵绵的博客
📚 所属专栏:

1. JAVA 知识点专栏

        深入探索 JAVA 的核心概念与技术细节

2.JAVA 题目练习

        实战演练,巩固 JAVA 编程技能

3. c 语言知识点专栏

        揭示 c 语言的底层逻辑与高级特性

4. c 语言题目练习

        挑战自我,提升 c 语言编程能力

5.Mysql 数据库专栏

        了解 Mysql 知识点,提升数据库管理能力

6.html5 知识点专栏

         学习前端知识,更好的运用它

📘 持续更新中,敬请期待❤️❤️

2. 表单 

在 HTML 中,一个完整的表单通常由 表单域、表单控件 (也称为表单元素) 和提示信息 3 个部分构成。

【HTML5】html5 开篇基础(5)

3. 表单域 

表单域是一个包含表单元素的区域,
在 HTML 标签中,

标签用于定义表单域,以实现用户信息的收集和传递
会把它范围内的表单元素信息提交给服务器,


 

各种表单元素控件
  • action 属性指定表单提交数据的服务器 URL。
  • method 属性指定 HTTP 请求方法,常用的值为 GETPOST

我们现在暂时不用表单域提交数据给服务器,只需要学会写 form 等标签即可. 等之后学习服务器编程阶段才会学习到该知识点。

4. 表单控件

在英文单词中,input 是输入的意思,而在表单元素中 标签用于收集用户信息在 标签中,标签是一个单标签。包含一个 type 属性, 根据不同的 type 属性值,输入字段拥有很多种形式(可以是文本字段、复选框、掩码后的文本控件、单选按钮等)。


 文本输入控件

单行文本输入框()用于接收用户输入的单行文本,如用户名、地址等。
密码输入框()用于输入密码,输入的内容不可见。

选择控件 

单选按钮()用户只能选择一个选项,通常用于性别、是 / 否等单选情况。
​
复选按钮()用户可以选择多个选项,通常用于兴趣爱好、服务条款同意等。​

按钮控件

提交按钮(

用于提交表单的数据到指定的服务器端。
重置按钮()用于重置表单中所有的输入,使其恢复到初始状态。
普通按钮()不会提交表单,通常用于与 JavaScript 交互触发事件
文件选择框()用于上传文件,如图片、文档等

 input 标签常用属性

【HTML5】html5 开篇基础(5)

name 属性

name 是每个表单元素都有的属性值,主要给后台人员使用,方便后台人员识别并处理数据。

除此以外我们还要注意在选择控件中其 name 属性必须要相同,这样单选按钮才能实现单选功能(否则就能多选),复选按钮也同理。

value 属性 

value 属性在文本输入控件中设置和按钮控件中设置都可以将其 value 值显示出来。 而选择控件是不显示的。


    

按钮:

【HTML5】html5 开篇基础(5)


所以 value 在选择控件中是不设置的。

checked 属性

规定此 Input 元素首次加载时应当被选中,应用于选择控件中。


    
按钮:

【HTML5】html5 开篇基础(5)

maxlength 属性

适用于文本输入控件,它能决定文本输入控件中输入字段的最大长度。

 

 下面是一个使用 的示例:


 在这个例子中,点击 ” 请输入用户名:” 文本会使 元素获得焦点。

核心:

标签用于创建下拉列表,用户可以从中选择一个选项。它通常用于表单中,每个选项通过 标签定义。

1.


    

【HTML5】html5 开篇基础(5)

 

在表单元素中,

  通过

cols=“每行中的字符数”,rows=“显示的行数”,我们在实际开发中不会使用,都是用 CSS 来改变大小,

【HTML5】html5 开篇基础(5)

 5. 提示信息

这个最简单,根本不需要标签,在 form 标签内填入适当的文字就可以当作提示信息用了。

6. 额外知识点

以上的标签都可以独立存放,不需要特定放在 form 中。form 的作用只是能把这些元素信息给提交到服务器,没有 form 就提交不了。

原文地址: 【HTML5】html5 开篇基础(5)

    正文完
     0
    Yojack
    版权声明:本篇文章由 Yojack 于2024-10-29发表,共计1841字。
    转载说明:
    1 本网站名称:优杰开发笔记
    2 本站永久网址:https://yojack.cn
    3 本网站的文章部分内容可能来源于网络,仅供大家学习与参考,如有侵权,请联系站长进行删除处理。
    4 本站一切资源不代表本站立场,并不代表本站赞同其观点和对其真实性负责。
    5 本站所有内容均可转载及分享, 但请注明出处
    6 我们始终尊重原创作者的版权,所有文章在发布时,均尽可能注明出处与作者。
    7 站长邮箱:laylwenl@gmail.com
    评论(没有评论)