HTML——表单类的标签

第1关:表单元素——文本框

你可以使用标签来创建一个输入框,使用type属性来指定input元素的类型,使用name属性来规定input元素的名称,它可以对提交到服务器后的表单数据进行标识。

这里type="text",表示普通文本的输入。




    


    
姓名:
    

第2关:表单元素——密码框

可以发现: 密码框的值是以圆点表示的,不会明文显示。




    


    
密码:

    

第3关:表单元素——单选框

你可以使用来创建一个单选框,需要注意的是:同一组单选框的name属性的值要一样

这里type="radio",表示单选框。




    


    1. HTML是什么语言?(单选题)

A:高级文本语言

B:超文本标记语言

C:扩展标记语言

D:图形化标记语言

第4关:表单元素——多选框

你可以使用来创建一个多选框。

需要注意的是:同一组多选框的name属性的值要一样

这里type="checkbox",表示多选框。




    


    休闲方式:

逛街

看电影

第5关:表单元素——checked属性




    


    婚姻状况:

未婚

已婚

第6关:表单元素——disabled 属性

这里在多选框里添加disabled属性即可,它会禁用该input元素,其默认值为disabled




    


    难度系数:

简单

中等

困难

第7关:表单元素——label 标签

标签的作用主要是提高用户体验性。当点击元素内的文本时,焦点会自动定位到与标签绑定的表单元素上。通俗地说,就是点击文本也能选择表单元素。

需要注意的是:标签的for属性的值要和相应表单元素的id的值相同。这样才能把标签和表单元素绑定到一起。




    


    
    
 

第8关:表单元素——下拉列表




    


    选择版块:
    


        
	

第9关:表单元素——文本域

第10关:表单元素——提交按钮

你可以使用来创建一个提交按钮,用于向服务器端发送数据。




    



    

第11关:表单元素的综合案例

笔记

  • 类的名字是common,不是.common
  • 用户名:

  •  每一部分外面都是div标签

  • 男 

  • 未婚

    这两种写法结果是相同的,确保文本在label标签内即可

  • 的作用是什么




    
    


 
    
用户名:
昵称:
性别:
教育程度:
婚姻状况:
兴趣爱好:
描述自己的特点:

你可能感兴趣的:(educoder,html,前端)