HTML 入门手册(二)

目录

HTML 入门手册(一)

10-表单

11-input标签

11.1文本框 (text)

11.2密码框 (password)

11.3单选按钮 (radio)

11.4复选框 (checkbox)

11.5普通按钮

11.6提交按钮 (submit)

11.7重置按钮 (reset)

11.8隐藏域 (hidden)

11.9文件上传 (file)

11.10数字输入 (number)

11.11日期输入 (date)

12-button标签

13-下拉框

单选下拉框

多选下拉框

默认选中

下拉框组

14-多行文本textarea标签

15-多媒体

音频(audio)

视频(video)


HTML 入门手册(一)

10-表单

        表单用于向服务器传输数据。form 元素是块级元素,其前后会产生折行表单提交时,必须设置表单元素的name属性值,否则无法获取数据。表单需要结合表单元素一起使用。

常用属性

  • action 提交表单的地址

  • method 提交方式 (不区别大小)
    • GET提交 get

    • POST提交 post

  • target 提交数据时打开窗口的方式
    • 当前窗口 _self

    • 新(空白)窗口 _blank

    
        
            
            用户名:
            
          
            密码:
            
          
            
          
    
  • action 属性指定了表单数据将被提交的目标URL。

  • method 属性指定了提交数据的HTTP方法。

  • target 提交数据时打开窗口的方式。

  • label 元素用于标签文本,提供了对应输入元素的描述。

  • input 元素用于创建不同类型的输入字段,例如文本框和密码框。

  • required 属性用于指示输入字段为必填项。

  • type="submit" 的 元素创建了提交按钮。

表单中还可以包含其他类型的输入元素,如单选按钮、复选框、文本域等。

HTML 入门手册(二)_第1张图片

Get

HTML 入门手册(二)_第2张图片

POST

HTML 入门手册(二)_第3张图片

GET请求与POST请求的区别:

  • GET用于获取资源,而POST用于提交数据。

  • GET请求的数据附在URL中,POST请求的数据在请求主体中。

  • GET请求适用于无副作用的操作,POST请求适用于有副作用的操作。

  • GET请求的数据对用户可见,安全性较低;POST请求的数据对用户不可见,相对更安全。

  • GET请求可被缓存,可以被书签保存;POST请求不可被缓存,不会被保存到书签中。

  • GET请求在URL中传递的数据有长度限制,POST理论上没有限制。

11-input标签

  • 标签规定了用户可以在其中输入数据的输入字段。

  • 元素在

    元素中使用,用来声明允许用户输入数据的 input 控件。

输入字段可通过多种方式改变,取决于 type 属性。如下:

  • button

  • checkbox

  • color

  • date

  • datetime

  • datetime-local

  • email

  • file

  • hidden

  • image

  • month

  • number

  • password

  • radio

  • range

  • reset

  • search

  • submit

  • tel

  • text

  • time

  • url

  • week

        以下是常见的 类型:

11.1文本框 (text)

        用于单行文本输入。


11.2密码框 (password)

        用于输入密码,文本将被遮蔽。


11.3单选按钮 (radio)

        用于从一组选项中选择一个。name="gender"确定为同一组。

性别:
 男
 女
11.4复选框 (checkbox)

        用于选择一个或多个选项。

爱好:
 听歌
看书
吹牛

HTML 入门手册(二)_第4张图片

11.5普通按钮

        用于提交表单数据。


11.6提交按钮 (submit)

        用于提交表单数据。


11.7重置按钮 (reset)

        用于重置表单中的所有字段为默认值。


11.8隐藏域 (hidden)

        用于存储不希望用户看到的数据,通常用于在提交表单时传递额外的信息。


11.9文件上传 (file)

        用于用户选择并上传文件。


HTML 入门手册(二)_第5张图片

11.10数字输入 (number)

        用于接受数字输入,可以设置最小值、最大值和步长。

    step 属性规定 元素的合法数字间隔。



HTML 入门手册(二)_第6张图片

11.11日期输入 (date)

        用于选择日期。


HTML 入门手册(二)_第7张图片

12-button标签

   
            提交按钮
            重置按钮         

        总体而言,         

HTML 入门手册(二)_第8张图片

HTML 入门手册(二)_第9张图片

注:如果 option 不设置 value="xx" 那边提交的时候会把 option 对应的值带上。

    上海
    北京
    广州
    深圳
    

HTML 入门手册(二)_第10张图片

多选下拉框

        如果你想要允许用户选择多个选项,可以添加 multiple 属性:


  。。。。。

        用户可以按住 Ctrl(在Windows和Linux中)或 Command(在Mac中)键来选择多个选项。

HTML 入门手册(二)_第11张图片

HTML 入门手册(二)_第12张图片

默认选中

        使用 selected 属性来设置下拉框的默认选项。

             
  北京
  ......

下拉框组

        使用 元素创建下拉框中的分组


  
    上海
    北京
    广州
    深圳
  
  
    花生炖
    落山鸡
    乱炖
  

HTML 入门手册(二)_第13张图片

14-多行文本textarea标签

             

  • name: 定义文本域的名称,用于在表单提交时标识该字段。

  • rows: 定义文本域的行数,指定可见的文本行数。

  • cols: 定义文本域的列数,指定每行可见的字符数。

  • readonly: 如果设置为 readonly,则文本域将只读,用户无法编辑。

  • disabled: 如果设置为 disabled,则文本域将禁用,用户无法编辑,并且在表单提交时不会提交其值。

HTML 入门手册(二)_第14张图片

15-多媒体

        多媒体元素在HTML中用于嵌入各种媒体内容,如图像、音频和视频。图像之前写到了,这里咱们直接看音视频

音频(audio)
    
        
        
        
        
            
            你的浏览器不支持音频播放。
        
    

  • controls: 启用浏览器提供的音频控件,如播放、暂停、音量控制等。

  • : 指定音频文件的URL和类型,以便浏览器选择支持的格式。

HTML 入门手册(二)_第15张图片

视频(video)


  
    你的浏览器不支持视频播放。

  • width 和 height: 视频播放器的宽度和高度。

  • controls: 启用浏览器提供的视频控件,如播放、暂停、全屏等。

  • : 指定视频文件的URL和类型,以便浏览器选择支持的格式。

HTML 入门手册(二)_第16张图片

叮,已入门。

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