三、表单元素

①<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. 使用jquery.mCustomScrollbar自定义滚动条(3)callback onCreate

    碰到了一个问题,想简洁,所以在页面上使用 <div class="div_box mCustomScrollbar" data-mcs-theme="dark-3& ...

  2. Zookeeper的集群安装

    Zookeeper的集群安装 关闭防火墙 安装jdk 下载Zookeeper的安装包 解压Zookeeper的安装包 进入Zookeeper的安装目录中conf目录 将zoo_sample.cfg复制 ...

  3. Hive格式各种格式下不同压缩算法的比较

    原始Text格式的hive分区大小为119.2G. 压缩算法 Text格式 Parquet格式 ORC RCFile 不压缩 119.2G 54.1G 20.0G 98G Snappy压缩 30.2 ...

  4. 信息安全-加密:RAS 加密

    ylbtech-信息安全-加密:RAS 加密 1.返回顶部 1. RSA 是不对称的加密(加密密钥和解密密钥不同  其中 一个为公钥,一个为私钥): 公钥和私钥的产生是基于一对很大的素数(十进制来说 ...

  5. [转][C#]TopSelf

    新建一个批处理,用于启动 TopSelf 服务 @echo off Service.exe install net start Service 或者简化成 @echo off Service.exe ...

  6. CentOS 7安装Oracle 11gR2以及设置自启动(2)

    6.创建表空间和用户授权 (1).连接数据库 $ sqlplus / as sysdba (2).创建数据库表空间 语法: create tablespace 表空间名 datafile ‘物理地址( ...

  7. Java里数组的三种初始化方式

    静态初始化 除了用new关键字来产生数组以外,还可以直接在定义数组的同时就为数组元素分配空间并赋值. // 静态初始化 int[] iStaticArr = { 5, 2, 0 }; LOLHero[ ...

  8. 凭什么说AMQP比JMS优秀啊?JMS才是真正实现了一个客户端调用多种产品的消息中间件啊

    一.AMQP 历史​ 消息队列(Message Queue)起源于一位来自 MIT 的硬件设计教育工作者 Vivek Ranadivé 设想了一种通用软件总线,就像主板上的总线那样,供其他应用程序接入 ...

  9. (转)Linux netstat命令详解

    简介 Netstat 命令用于显示各种网络相关信息,如网络连接,路由表,接口状态 (Interface Statistics),masquerade 连接,多播成员 (Multicast Member ...

  10. java运行原理剖析

    java是一种编译型语言,我们开发好的代码是不能够直接运行的,需要我们程序员进行编译之后,将字节点文件载入jvm虚拟之后,才可以运行操作 其原理是 java源代码-------编译-------> ...