三、表单元素

①<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. PAT 乙级 1078 字符串压缩与解压 (20)

    文本压缩有很多种方法,这里我们只考虑最简单的一种:把由相同字符组成的一个连续的片段用这个字符和片段中含有这个字符的个数来表示.例如 ccccc 就用 5c 来表示.如果字符没有重复,就原样输出.例如 ...

  2. Java NIO系列教程（三） Channel之Socket通道

    目录: <Java NIO系列教程(二) Channel> <Java NIO系列教程(三) Channel之Socket通道> 在<Java NIO系列教程(二) Ch ...

  3. P1096（简单dp）

    题目描述 在N个数中找出其和为M的若干个数.先读入正整数N(1< N< 100)和M(1< M< 10000),  再读入N个正数(可以有相同的数字,每个数字均在1000以内) ...

  4. 信息安全-加密：RSA 算法

    ylbtech-信息安全-加密:RSA 算法 RSA公开密钥密码体制.所谓的公开密钥密码体制就是使用不同的加密密钥与解密密钥,是一种“由已知加密密钥推导出解密密钥在计算上是不可行的”密码体制. 1.返 ...

  5. 定位cpu内存问题

    定位cpu内存问题 ps -Hp pid  显示进程的线程,P 按CPU内存排序 jstack pid>pid.log 将线程栈 dump 到日志文件中 线程号 十进制转换为 十六进制 在文件中 ...

  6. window的三大功能，行内样式获取的讲解 getcomputerStyle

    window的三大功能: js引擎 dom渲染 获取行内中css的属性: chrome和Firefox加上 ie9+(所谓的高级浏览器)用的方法: window.getComeputerStyle(d ...

  7. 用ADB打开MUMU模拟器的WLAN用于设置代理IP

    adb connect 127.0.0.1:7555 adb shell am start -a android.intent.action.MAIN -n com.android.settings/ ...

  8. 二进制编译安装httpd服务

    systemctl stop httpd yum remove httpd-----------------------(在做之前 先删掉httpd) 安装编译环境 yum -y groupinsta ...

  9. 如何把RabbitMQ卸载干净

    原文转载至:https://blog.csdn.net/w893932747/article/details/81018191 To uninstall RabbitMQ and Erlang fro ...

  10. Linux入门：常用命令：查看硬盘、分区、CPU、内存信息

    查看硬盘信息 $df -lh    #查看所有硬盘的使用状 $du -sh /etc   #查看etc目录大小 #获得文件大小很方便,主要是目录 外部系统挂载 $mount               ...