三、表单元素

①<form></form>表单标签，代表表单

主要属性：1、action提交到的页面。   2、method数据提交方式（get显示提交，有长度限制。post隐式提交）

②文本类（name值必须写）

1、<input />

1.文本框type="text"。value文本框的值（框内显示默认内容），name文本框的名称。

2.密码框type="password"。value密码框的值（默认密码），name密码框的名称。

3.隐藏域type="hidden"。value隐藏域的值（默认，但不显示），name隐藏域的名称。

2、<textarea></textarea>文本域

常见属性：

disable="disable"禁用该文本域。

form_id规定文本域所属的表单。

cols="number"规定文本域内的可见宽度。

rows="number"规定文本域的可见行数。

maxlength="number"规定文本域的最大字符数。

readonly="readonly"规定文本域为只读。

！注释：文本域的value值写在双标签中间。

③按钮类（value值必须写）

1.普通按钮type="button"。name按钮名称，value按钮上显示的文字。

2.提交按钮type="submit"。name按钮名称，value按钮上显示的文字。

3.重置按钮type="rest"。name按钮名称，value按钮上显示的文字。功能：将表单里面的所有内容重置为默认。

4.图片按钮type="image"。name按钮的名称，src图片来源地址。

④选择按钮

1.单选按钮type="radio"。name按钮组的名称（相同name下的多个radio为单选），vlaue按钮的值

2.复选框，多选按钮type="checkbox"。name复选框的 名称，value复选框的值。

！附：对象方法：blur()移开焦点，click(一次鼠标点击)，focus赋予焦点。

3.下拉列表<select></select>。

常见属性：

name下拉列表名称。

multiple="multiple"，规定多选，按住ctrl键。

from_id，规定所属的表单id。html5

autofocus=“”autofocus“，规定页面加载后自动获得焦点。html5

required="required"，规定区域是必填的。html5

disable="disable"，规定禁用。

size下拉列表的可选项目数：=1时为菜单。>1时为下拉列表。

<option></opyion>下拉列表的项标签，每一个代表一项选项。value该项的值。selected="selected"默认选中一项。

4.文件选择type="file"。name文件选择的名称。

5。<label></label>标签为input标签定义标注标记。for="id"，id与关联的input的id相同，使此标签获得指向id的input。

<form action="a.html">

   <input type="text" name="tet" />文本框

   <input type="password" name="pass" />密码框

   <input type="hidden" name="hid" />隐藏域

   <textarea>文本域</textarea>

   <input type="button" value="按钮" id="a" />普通按钮

   <input type="submit" value="提交" />提交按钮

   <input type="reset" value="重置" />重置按钮

   <input type="image" src="1.jpg" />图片按钮

   <input type="radio" name="rad" /><input type="radio" name="rad" />

   <input type="checkbox" name="check" /><input type="checkbox" name="check" />

   <select name="sele">

      <option>选项1</option>

      <option selected="selected">选项2</option>

      <option>选项3</option>

   </select>

   <input type="file" name="文件选择" />文件选择

   <label for="a">指向id为a的按钮</label>

</form>

四、框架标签

①<framest></framset>框架集。！注释：如果使用该标签该页面不能有body标签。

属性：cols="number,number"左右拆分。

rows="number,*"上下拆分。

frameborder边框，默认为1。

<frame />框架，是<framest>中的一个框架。src显示指向地址，scrolling滚动条属性。

<frameset cols="30%,*">

   <frame src="a.html" />

   <frameset rows="300px,*">

      <frame src="b.html" />

      <frame src="c.html" />

   </frameset>

使用frameset标签时页面内不能用body标签

</frameset><noframes></noframes>

②<iframe>行内框架，可以包含在一个普通的页面中。sec显示地址，width、height宽高，frameborder边框，scrolling滚动条。

<body>

   <iframe src="a.html"></iframe>

</body>

六、其他标签

①<marquee></marquee>滚动标签。direction滚动方向，内容可以是 文字、图片。

②<mark></mark>标记标签，标记文字。

③<hr />分割线。效果就是一条直线。

④<embed></embed>嵌入视频标签。最简单的方法就是点击视频分享复制HTML代码到页面。

⑤<video></video>视频标签。格式只能是MP3、MP4。

常用属性：

src视频路径

controls播放控件

autoplay自动播放（页面加载完后）

loop循环播放

width、height宽高

⑥<audio></audio>音频标签，  <source>子标签 src音频位置。

controls播放控件

autoplay自动播放

loop循环播放

<body>

   <marquee>滚动标签<img />滚动图片</marquee>

   <font>标记文字<mark>它</mark>，标记它</font>

   <hr />分割线

   <embed src="">嵌入网页视频，直接复制粘贴html代码</embed>

   <video src="a.mp4">视频只能是MP3、MP4格式</video>

   <audio controls="controls" loop="loop"><!--添加了播放控件以及自动播放-->

      <source src="b.mp3" />

   </audio>

</body>

HTML学习-2标记标签-2的更多相关文章

  1. HTML学习-2标记标签-1

    大致可以分为以下6类学习: 1.通用标签. 2.常用标签. 3.表格标签. 4.表单元素. 5.框架. 6.其他. 一.通用标签.及属性 1.<body></body>标签,主 ...

  2. 学习笔记_Java_day13_JSTL标签库（1、2、3、4、5、6、7、8）

    1.一种标签语言 day13 l  JSTL标签库(重点) l  自定义标签(理解) l  MVC设计模式(重点中的重点) l  Java三层框架(重点中的重点) JSTL标签库 1 什么是JSTL ...

  3. java continue break 关键字 详解 区别 用法 标记 标签 使用 示例 联系

    本文关键词: java continue break 关键字 详解 区别  用法 标记  标签 使用 示例 联系   跳出循环 带标签的continue和break 嵌套循环  深入continue ...

  4. JUnit5学习之五：标签(Tag)和自定义注解

    欢迎访问我的GitHub https://github.com/zq2599/blog_demos 内容:所有原创文章分类汇总及配套源码,涉及Java.Docker.Kubernetes.DevOPS ...

  5. HTML学习笔记之标签基础

    目录 1.基本标签 2.链接 3.图像 4.表格 5.列表 6.块与布局 1.基本标签 (1)标题与段落 标签 <h1> ~ <h6> 分别用于定义一至六级标题,标签 < ...

  6. 前端学习(一) body标签(上)

    body标签中相关标签 主要内容: 字体标签:  h1~h6.<font>.<u>.<b>.<strong><em>.<sup> ...

  7. 重温JSP学习笔记--JSTL标签库

    以前写jsp的时候对jstl标签库是有些抵触的,因为我觉得嵌入java代码的方式几乎无往不利,没有必要使用标签库,不过这次复习还是好好地学习了一下,发现这个还是很有用处的,用得好能省不少事,JSTL是 ...

  8. JAVA学习Swing章节标签JLabel中图标的使用

    package com.swing; import java.awt.Color; import java.awt.Component; import java.awt.Container; impo ...

  9. JQery w3school学习第一章 标签的隐藏和显示

    鄙人初学JQuery,最关键的是JQuery获取标签对象的方式 这一章学习的是点击按钮让所有标签的文字以及标签栏的位置隐藏起来,因为单纯的隐藏文字,还是会有空格和空行的影响 这里最关键的代码就是 $( ...

随机推荐

  1. levenshtein函数

    Levenshtein算法已在部分DBMS中实现. (例如:PostgreSQL:http://www.postgresql.org/docs/9.1/Static/fuzzystrmedi.html ...

  2. 读取 Excel 之 Epplus

    using (OpenFileDialog fd = new OpenFileDialog()) { fd.Filter = "Excel 2007文件(*.xlsx)|*.xlsx|所有文 ...

  3. C# int.ToString()

    C# int.ToString() 格式化数值:有时,我们可能需要将数值以一定的格式来呈现,就需要对数值进行格式化.我们使用格式字符串指定格式.格式字符串采用以下形式:Axx,其中 A 为格式说明符, ...

  4. mysql root情况

          180829 11:15:20 [ERROR] Fatal error: Please read "Security" section of the manual to ...

  5. [UE4]自定义服务器Service

  6. T-SQL 带参数存储过程

    创建带参数的存储过程 use StudentManager go if exists(select * from sysobjects where name='usp_ScoreQuery4') dr ...

  7. 高通9X07模块QMI架构使用入门

    QMI(Qualcomm Message Interface) 高通用来替代OneRPC/DM的协议,用来与modem通信.本文是摸索高通QMI机制一点经验,重点解读了如果建立拨号连接,仅供参考.qm ...

  8. (转）Makefile介绍

    2. Makefile介绍 make命令执行时,需要一个Makefile文件,以告诉make命令需要怎么样的去编译和链接程序. 首先,我们用一个示例来说明Makefile的书写规则.以便给大家一个感性 ...

  9. MySQL客户端管理

    mysql -P3306 -h localhost -u root -p 分别是:端口  服务器 用户名 有密码(这里可以先不用输入,带这个参数表示有密码,密码在打开客户端后输入,也可以在这里直接输入 ...

  10. PHP微信公众号开发之基本配置

    (提示:需要有服务器或云虚拟机) 一开始不明白公众号不是可以这样管理吗?                那么为什么用开发平台进行公众号开发,官方文档是这样说的 为了识别用户,每个用户针对每个公众号会产 ...