欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识！
您现在的位置是： 首页  >  IT编程

HTML学习笔记二

程序员文章站 2022-03-20 21:08:10
HTML表单： HTML表单用于搜集不同类型的输入 标签元素： HTML表单用于收集用户输入； form元素定义HTML表单 属性列表： | 属性 | 描述 | | | | | accept charset | 规定在被提交表单中使用的字符集（默认：页面字符集）。 | | action | 规定向何 ......

html表单：

  • html表单用于搜集不同类型的输入

< form >标签元素：

  • html表单用于收集用户输入；

    form元素定义html表单

< form >属性列表：
属性 描述
accept-charset 规定在被提交表单中使用的字符集（默认：页面字符集）。
action 规定向何处提交表单的地址（url）（提交页面）。
autocomplete 规定浏览器应该自动完成表单（默认：开启）。
enctype 规定被提交数据的编码（默认：url-encoded）。
method 规定在提交表单时所用的 http 方法（默认：get）。
name 规定识别表单的名称（对于 dom 使用：document.forms.name）。
novalidate 规定浏览器不验证表单。
target 规定 action 属性中地址的目标（默认：_self）。

表单元素：

表单元素指的是不同类型的 input元素、复选框、单选按钮、提交按钮……等

< input >标签：

< input >标签元素最重要的是 表单元素，标签根据不同的 type 属性，有多态性。

  • 文本输入：
<input type="text" />
  • 定义单选按钮输入
<input type="radio" />
  • 定义提交按钮
<input type="submit" />
action属性：
  • 定义在提交表单是执行的动作

向服务器提交表单的通常做法是提交按钮（submit）

action属性可以指定特定的脚本来处理被提交的表单数据

<form action="*.php[/.jsp/.asp]"></form>
method属性：
  • 定义提交表单时候所用的http方法(get或post)
<form action="*.php[/.jsp/.asp]" method="gep[/post]"></form>

使用技巧：

如果表单提交是被动的（比如搜索查询），并且没有重要数据。

使用get时，表单提交的数据在url中是可见的

反之——

表单是动态更新或者密码内容的，post更加适合，而且提交的数据在url不可见

name属性：

如果希望提交的表单数据可以被服务器获取到或者看见，就需要给表单元素添加一个name属性（在脚本中会按照字段接收数据信息）

< fieldset >标签：组合表单元素

  • < fieldset >组合表单中的相关数据
  • < legend >元素为< fieldset >元素定义标题
<!doctype html>
<html>
    <head>
        <title>用户</title>
    </head>
    <body>
        <form method="post">
            <fieldset>
                <legend>用户注册</legend>
                用户名：<br />
                <input type="text" name="name" />
                <br />
                密  码：<br />
                <input type="text" name="passworld" />
                <br />
                <input type="submit" value="确定" name="input" />
            </fieldset>
        </form>
    </body>
</html>

< select >标签：下拉列表

  • < select > 标签是开始

    < option > 元素定义可选择的选项

<select>
    <option value="中国">中国</option>
    <option value="美国">美国</option>
</select>

< textarea>标签：文本域

  • 定义一个文本域（多行输入字段）

  • rows / cols：文本域大小（px）

< button >标签：按钮

  • 定义一个可点击的元素按钮

html输入：

type属性（输入类型）：

值 描述
button 定义可点击按钮（多数情况下，用于通过 javascript 启动脚本）。
checkbox 定义复选框。
file 定义输入字段和 "浏览"按钮，供文件上传。
hidden 定义隐藏的输入字段。
image 定义图像形式的提交按钮。
password 定义密码字段。该字段中的字符被掩码。
radio 定义单选按钮。
reset 定义重置按钮。重置按钮会清除表单中的所有数据。
submit 定义提交按钮。提交按钮会把表单数据发送到服务器。
text 定义单行的输入字段，用户可在其中输入文本。默认宽度为 20 个字符。
number 用于包含数字值的输入字段
date 定义日期字段的输入
color 定义颜色的输入
range 定义一个范围的 滑块控件
month 定义日期字段输入或选择

输入限制（属性）：

属性 描述
disabled 规定输入字段应该被禁用。
max 规定输入字段的最大值。
maxlength 规定输入字段的最大字符数。
min 规定输入字段的最小值。
pattern 规定通过其检查输入值的正则表达式。
readonly 规定输入字段为只读（无法修改）。
required 规定输入字段是必需的（必需填写）。
size 规定输入字段的宽度（以字符计）。
step 规定输入字段的合法数字间隔。
value 规定输入字段的默认值。
height 规定高度（image）
width 规定宽度（image）

html图形：

html多媒体：

视频格式：

​ avi，wmv，mpeg，mov，flash(.swf/.flv)，mp4……

声音格式：

​ midi，rm，wav，mp3

object 元素：

object的作用是支持html助手（插件）

html音频：

使用< embed >元素标签：
<embed height="100" width="100" src="/*.mp3" />
使用< object >元素标签：
  • < object tag > 标签可以定义外部内容的容器
<object height="100" width="100" data="/*.mp3" />
使用 < audio >元素标签：（html5）
<audio control="controls">
    <source src="/*.mp3" type="audio/mp3" />
</audio>

html视频：

使用 < embed >元素标签：
<embed src="/*.mp4" height="200" width="200" />
使用< object >元素标签：
<object data="/*.mp4" height="200" width="200" />
使用< video >元素标签：（html5）
<video width="300" height="250" controls="controls">
    <source src="/*.mp4" type="video/mp4" />
</video>

上一篇： Android进阶之路(1)-详解MVC

下一篇： R语言关于“包”的知识点总结

推荐阅读