html5标签整理
html元素
基础标签
<!DOCTYPE> 定义文档类型(e.g <!DOCTYPE html>)
<html>定义一个HTML文档</html>
<title>文档标题</title>体现在网页最上端
<p>这是一个段落</p>
<a href="www.baidu.com">这是一个链接</a>
<br> 换行
<wbr>规定在文本中的何处适合添加换行符。(意思就是如何窗口变小,那么在你添加<wbr>这个标签的地方会换行)
<hr> 定义水平线
<!--....--> 定义一个注释
格式
<abbr t="world health organization">who</abbr> 定义一个缩写
<address></address> 定义文档作者/所有者的联系信息(斜体,该元素前后添加换行)
<b></b> 定义粗体文本
<bdi></bdi> 允许您设置一段文本,使其脱离其父元素的文本方向设置(比如使一段文字中的某一段文字倒着写)
<bdo dir="rtl(ltr)>"该段落文字从右到左(从左到右)显示</bdo> 定义文本方向
<blockquote cite="url"></blockquote> 定义块引用,cite规定引用来源;blockquote元素中一般嵌套p元素,用于标记被引用的文本,这些引用问嗯赢不直接位于blockquote元素中
<cite></cite> 定义引用(斜体);1、可以使你或者其他人从文档中自动摘录参考目录2、引用一个超链接。
<code>一段电脑代码</code> 定义计算机代码文本(短语标签)
所有的短语标签(只是不同的文字格式而已,建议使用css)
<em>呈现为被强调的文本
<strong>定义重要文本
<dfn>定义一个定义项目
<samp>定义样本文本
<kdb>定义键盘文本,它表示文本是从键盘上键入的。经常用在与计算机相关的文档或者手册中
<var>定义变量
<del></del> 定义文档中已删除的文本。(My favorite color is blue red!)属性cite:规定一个解释了文本被删除的原因的文档的url;datatime:规定文本被删除的日期和时间
<s></s> 定义加删除线的文本
<ins></ins>定义文本中新插入的文本。
<i>定义斜体文本</i>
<u>定义下划线文本。</u>
<mark></mark> 定义带有记号的文本.比如让一段文字在文本中高亮显示。
<meter></meter>定义度量衡,仅用于已知最大和最小值的度量(不能作为一个进度条来使用)
e.g<meter value="2" min="0" mix="10">2 out of 10</meter><br>
<meter value="0.6">60%</meter> result:()
<pre></pre> 定义预格式文本。(标签内格式是什么样的,输出格式就是什么样的。)
<progress value="20" max="100"></progress>定义运行中的任务进度(进程)。(两个属性value和max)
<q>这是引用的内容</q> 定义短引用。(相当于把标签中间的内容加了一个引号)。
<rp></rp> 定义不支持ruby元素的浏览器所显示的内容。
<rt></rt>定义字符的解释或发音。
<ruby></ruby>定义ruby注释
e.g<ruby>
汗<rp>(</rp><rt>han<rt><rp>)</rp>
渍<rp>(</rp><rt>zi<rt><rp>)</rp>
</ruby>
<small></small>定义小号文本。
<sub></sub>定义下标文本。
<sup></sup>定义上标文本。
<time></time> 定义一个时间/日期。属性:datatime规定日期/时间;pubdata指示元素中的日期/时间是最近的文档的发布日期。
表单
<form>定义一个html表单,用于用户输入。
<form>包含一个或多个以下表单元素:
<input> 规定了用户可以字其中输入数据的输入字段。
input属性: accept 规定通过文件上传来提交的文件的类型。(type=”file“)
alt 定义图像的替代文本(type=”image“)
antocomplete(含on|off两个属性) 规定<input>元素输入字段是否应该启用自动完成功能。
autofocus 规定当前页面加载时<input>元素应该自动获得焦点。(就是在输入框加上一个光标)
checked 规定在页面加载时应该被预先选定的<input>元素。(只针对type="checkbox"或者type="radio")
disable 规定应该禁用的<input>元素。(有一个输入框进制输入)
form规定<input>元素所属的一个或者多个表单。(可以把多个输入框联系起来,合为一个表单)
formenctype规定当表单数据提交到服务器时如何编码。
formaction规定当表单提交时处理输入控件的文件的URL(只针对type=”submit“和type=”image“)(就是点击链接之后的url不一样)
formmethod 定义发送表单数据到action URL的HTTP方法(只适合type=”submit“和type=”image“)
formtarget 规定标是提交表单后在哪里显示接收到响应名称或关键词(只适合type=”submit“和type=”image“)
height,weight规定<input>元素的高度、宽度。(只适合type=”image“)
list 属性引用<datalist>元素,其中包含<input>元素的预定义选型
max、min规定<input>元素的最大最小值
maxlength规定<input>元素中允许的最大字符数
mulitiple规定允许用户输入到<input>元素的多个值(同时可以上传多个文件)
name规定<input>元素的名称
pattern规定用于验证<input>元素值的正则表达式。
placeholder规定可描述的输入<input>字段预期值的简单的提示信息。(在输入框提示你输入的信息,当你开始输入时就会消失)
readonly规定输入字段是只读的
required规定必须在提交表单之前输入字段
size规定已字符数计的<input>元素的可见宽度
src规定显示为提交按钮的图像的URL(只针对type="image")
step规定合法数字间隔(傍边会出现这样的上下小三角,每次点击都是三个三个的变化)
type规定要显示的<input>元素的类型,一般有butten,checkbox(选框),color,data,datatime,data-local,email,file,hidden,image,month,number,password,radio,range,reset,search,submit,tel,text,time,url,week
value指定<input>value的值
<textarea>定义一个多行的文本输入控件(可容纳无限数量的文本,默认等宽字体,通过cols和rows规定textarea的尺寸大小)
textarea属性:autofocus 文本区域自动获得焦点(光标闪烁点)
cols,rows规定文本区域可见宽度和行数
disablle规定禁用文本区域
form规定文本区域所属的一个或多个表单。(将多个输入框归为一个表单)
maxlength规定文本区域允许的最大字符数
name规定文本区域名称
placeholder规定一个简短的提示,描述文本区域期望的输入值。(一个文字颜色较浅的解释文本,当开始输入时就消失)
readonly规定文本区域为只读
required规定文本区域是必需的/必填的(如果不填写无法进入下一步)
wrap规定当提交表单时,文本区域中的文本应该怎么样换行(hard换行(必须指定cols的值);soft不换行)
<botton>定义一个按钮
botton属性:autofocus规定页面加载时按钮自动获得焦点(在按钮周边出现蓝色亮光)
disable禁用该按钮
form规定按钮属于一个或多个表单
formaction规定当提交表单时向何处发送表单数据。覆盖form元素的action属性。(url)
formenctype规定向服务器发送表单数据之前如何对其进行编码
属性值:application/x-www-form-urlencoded 在发送前对所有字符进行编码(默认)
multipart/form-data 不对字符编码。当使用有文件上传控件的表单时,该值是必需的。
text/plain 将空格转换为“+",但不编码特殊字符。
formmethod规定用于发送表单数据的HTTP方法。覆盖form元素的methon属性
属性值:get:以url变量(使用method=”get“)的形式来发送。表单数据在url中以name/value对出现;get传送数据量不能大于2kb;不可传送敏感信息
post:以HTTP post的形式发送表单数据;较安全;没有大小限制
formnovalidata使用该属性,提交表单时不进行验证。覆盖form元素的novalidata属性。
formtarget规定在何处打开action URL.覆盖form元素的terget属性。
属性值:_blank在新窗口/选项卡中将表单提交到文档
_self在同一框架中将表单提交到文档(默认)
_parent在父框架中将表单提交到文档
_top在整个窗口将表单提交到文档
framename在制定的框架中将表单提交到文档
name规定按钮的名称(在后边使用css更改样式的时候用到name)
type规定按钮的类型
button该按钮是重置按钮
reset该按钮是可点击按钮
submit该按钮时提交按钮
value规定按钮的初始值(显示在按钮表面的文字或图案)
<select>用来创建下拉列表
select属性: autofocus,disable,form
multiple规定可同时选多个选型
name定义下拉列表的名称
required规定用户在提交表单前必需选择一个下拉列表的选项
size(number)规定下拉列表中可见选项的数目
<option>规定下拉列表中的一个选项;通常不带有任何属性使用,但是通常需要使用value属性,此属性会指示服务器的内容。与select连用。
<option>属性:disabled,value
lable(text)定义当使用<optgroup>时所使用的标注。
selected规定选项(在首次显示在列表时)表现在选中状态。(刚拉开列表时默认选中的一个)
<optgroup>用于把相关的选型组合在一起。当选项很多时可以使用(属性:disable,label(图中的加粗黑体字,不可被选中,只是描述组))
<fieldset>将表单内的相关元素分组,并在相关表单元素周围绘制边框。
<fieldset>属性:disable,form,name
<lengend>定义fieldset元素的标题。
<lable>为input元素定义标注。如果你在label元素内点击文本,就会触发控件。<label>标签的for属性应与相关元素的id属性相同
<lable>属性:for(元素id)规定lable与哪个表单元素绑定
<form>
<datalist>规定了input元素可能的选项列表(在输入框输入的时候会出现下拉选项)
<keygen>规定用于表单的密钥对生成器的字段。当提交表单时,私钥存储在本地,公钥发送到服务器。
<keygen>属性:autofocus使<keygen>字段在加载时获得焦点。
challenge如果使用,则将keygen的值设置为在提交时询问。
disabled禁用<keygen>字段
form定义该<keygen>字段所属的一个或多个表单。
keytype定义密钥的安全算法。
keytype属性值:rsa 默认。规定RSA安全算法。RSA密钥强度可有用户选择。
dsa规定DSA安全算法。DSA密钥长度可由用户选择。
ec规定EC安全算法。EC密钥强度可由用户选择。
ec
name定义元素的唯一名称。name属性用于在提交表单时搜集字段的值。
<output>定义一个计算的结果
<output>属性:for描述计算中使用的元素与计算结果之间的联系。
form定义输入字段所属的一个或多个表单。
name定义对象的唯一名称(表单提交时使用)
框架
<iframe>定义内联框架。一个内联框架被用来在当前 HTML 文档中嵌入另一个文档。
<iframe>属性:height,width规定<iframe>的高度和宽度。
name规定<iframe>的名称
sandbox对<iframe>的内容定义一系列额外的限制
sandbox属性值:” “启用所有限制条件
allow-same-origin允许将内容作为普通来源对待。如果未使用该关键字,嵌入的内容将被视为一个独立的源。
allow-top-navigation嵌入的页面的上下文可以导航(加载)内容到顶级的浏览上下文环境。如果未使用该关键字,这个操作不可使用
allow-forms允许表单提交
allow-scripts允许脚本执行
seamless规定<iframe>看起来像是父文档中的一部分。(没有边框和滚动条)
src(url)规定在<iframe>中显示的文档的URL。
srcdoc(HTML_code)规定页面中HTML内容显示在<iframe>中。
图像
<img>定义图像
<img>属性:alt规定图像的替代文本
crossorigin(anonymous,use-credentials)设置图像的跨域属性
height,width规定图像的高度和宽度。
ismap将图像规定为服务器端图像映射。
src规定显示图像的url
usemap将图像定义为客户器端图像映射。
html属性
class 为html元素定义一个或多个类名(classname)(类名从样式文件引入)(class="这里可以填写多个class属性")
id 定义元素唯一的id (id=" 引号里只可以填入一个id,多个无效")
style 规定元素的行内样式
title 描述了元素的额外信息
accesskey 设置访问元素的键盘快捷键
contenteditable 规定是否可以编辑元素的内容
contextmenu 指定一个元素的上下文菜单,当用户右击该元素,出现上下文菜单
data-* 用于存储页面的自定义数据
dir 设置元素中内容的文本方向
draggable 指定某个元素是否可以拖动
dropzone 指定是否将数据复制、移动,或链接,或删除
hidden hidden属性规定对元素进行隐藏
lang 规定元素中内容的语言代码
spellcheck 检查元素是狗拼写错误
tabindex 设置元素的Tab键控制次序
translate 指定是否一个元素的值在页面载入时是否需要翻译
html5标签整理的更多相关文章
- HTML4 And HTML5 标签整理
一.文字备忘之标签 HTML5中新增的标签<article> 定义文章 <aside> 定义页面内容旁边的内容 <audio> ...
- HTML5资料整理 [From luics]
来自http://www.cnblogs.com/luics/,新浪微博@徐凯-鬼道 HTML5资料整理 项目组要做html5这块,花了一周左右时间收集的,快有一年时间了,部分内容需要更新,仅供参 ...
- HTML5标签的使用和作用
在菜鸟教程中找了一些关于HTML5的知识点,觉得很有用,可以整理一下,以后使用. 这是一个基本的HTML5文档: <!DOCTYPE html><html><head&g ...
- 完美解决IE(IE6/IE7/IE8)不兼容HTML5标签的方法
完美解决IE(IE6/IE7/IE8)不兼容HTML5标签的方法 HTML5的语义化标签以及属性,可以让开发者非常方便地实现清晰的web页面布局,加上CSS3的效果渲染,快速建立丰富灵活的web页 ...
- HTML5标签与HTML4标签的区别示例介绍_html5教程技巧
(1)概念的变化: HTML5专注内容与结构,而不专注的表现 <header> <hgroup>导航相关数据</hgroup> </header> &l ...
- 解决IE(IE6/IE7/IE8)不兼容HTML5标签的方法
方式一:Coding JavaScript <!--[if lt IE9]> <script> (function() { var e = "abbr, articl ...
- HTML标签整理
第一次接触动态网站的相关代码,对程序里HTML的标签不理解.在这里会把碰到的HTML标签整理出来,持续更新. 1.<form></form>:用于声明表单,定义采集数据的范围, ...
- [js开源组件开发]html5标签audio的样式更改
html5标签audio的样式更改 由于html5的流行,现在移动端大多数的需求都可以使用audio来播放音频,但您可能只是需要很简单的播放/停止效果,但不同的浏览器上的audio样式却不尽人意,所以 ...
- phpcms标签整理_当前栏目调用
phpcms标签整理_当前栏目调用 转载 **//SQL语句调用: {pc:get sql="select * from phpcms_category where catid in($ca ...
随机推荐
- Docker笔记(四):Docker镜像管理
原文地址:http://blog.jboost.cn/2019/07/16/docker-4.html 在Docker中,应用是通过容器来运行的,而容器的运行是基于镜像的,类似面向对象设计中类与对象的 ...
- UEditor 之初体验后记
1.UEditor 基本介绍 1.1.关于 UEditor 1.2.UEditor 现状 2.UEditor 简单使用 2.1.将 UEditor 源码集成到项目中 2.2.让 UEditor 的 U ...
- C#3.0新增功能05 分部方法
连载目录 [已更新最新开发文章,点击查看详细] 分部类或结构可以包含分部方法. 类的一个部分包含方法的签名. 可以在同一部分或另一个部分中定义可选实现. 如果未提供该实现,则会在编译时删除 ...
- [leetcode] 464. Can I Win (Medium)
原题链接 两个人依次从1~maxNum中选取数字(不可重复选取同一个),累和.当一方选取数字累和后结果大于等于给定的目标数字,则此人胜利. 题目给一个maxNum和targetNum,要求判断先手能否 ...
- websocket的加密和解密过程
加密: import struct msg_bytes = "the emperor has not been half-baked in the early days of the col ...
- 机器学习之K均值聚类
聚类的核心概念是相似度或距离,有很多相似度或距离的方法,比如欧式距离.马氏距离.相关系数.余弦定理.层次聚类和K均值聚类等 1. K均值聚类思想 K均值聚类的基本思想是,通过迭代的方法寻找K个 ...
- linux初学者-数据库管理MariaDB篇
linux初学者-数据库管理MariaDB篇 MariaDB是一种数据库管理系统,是MySQL的一个分支,但是比MySQL更加优秀,可以说是MySQL的替代品.MariaDB使用的是SQL语句.下文将 ...
- GitLab-CI 来自动创建 Docker 镜像
1.what is gitlab-ci docker image CI/CD 自动化集成,自动化部署.简单的说就是把代码提交到gitlab管理的同时部署到指定的server,打成docker imag ...
- .gitignore文件我自己常用的配置
我项目中一般不需要上传到git服务器上的有 .idea ------.idea目录 .mvn ------.mvn目录 .iml mvnw mvnw.cmd logs/ --- 我生成的日志文件目录 ...
- 实现跳转的jsp小例子
<%@page import="java.io.UnsupportedEncodingException"%> <%@ page language="j ...