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 ...
随机推荐
- 9.16考试 第一题 X国的军队题解
这道题总体来看还是比较满意的.连想带打不超过半个小时,打了不到当时基本读懂后就感觉是贪心,但贪什么很重要,当时一开始想的是贪心死亡人数,从小到大搞,然后自己造了几个小数据,还好WA了,然后又列了一个式 ...
- //Thread::Stop();
//Thread::Stop(); Thread::StopSoon();
- PJzhang:python基础入门的7个疗程-five
猫宁!!! 参考链接:易灵微课-21天轻松掌握零基础python入门必修课 https://www.liaoxuefeng.com/wiki/1016959663602400 第十三天:代码组织 类是 ...
- Atom实用插件
下载atom狠戳本链接 中文简体插件(工具栏,右键菜单,设置菜单) simplified-chinese-menu 代码格式化插件(支持多种语言) atom-beautify 智能补全资源路径插件 a ...
- 端口,OSI7层模型,TCP的三次握手和四次挥手,进度条
1.端口: 端口是为了将同一个电脑上的不同程序进行隔离 IP是找电脑,端口是找电脑上的程序 MySQL是一个软件,帮助我们在硬盘上进行文件操作,默认端口是3306 Redis是一个软件,帮助我们在内存 ...
- IDEA及IDEA汉化包
IDEA 官网:http://www.jetbrains.com/idea/download/#section=windows IDEA社区版(百度云):http://pan.baidu.com/s/ ...
- vs2013类模板的修改
很多人一起写程序,往往都有规定的代码模板,比如要求每个类都有注释,说明开发者是谁,类的功能以及其他信息.如果每次建一个类,手工去复制这些信息很麻烦,也很容易遗漏.我们可以直接修改VS2013创建类的时 ...
- 《VR入门系列教程》之16---第一个OculusVR应用
第一个VR应用 之前我们已经将Oculus的开发包导入到空工程中了,现在我们来构建第一个桌面VR的示例.开发包中已经有一个示例场景,只需要几步就可以让这个场景运行起来.我们将要构建的这个Demo ...
- php框架内的数据库操作（微擎，tp，yii2）
微擎数据库操作 关键字 查询 pdo_get pdo_getcolumn pdo_getall pdo_getslice pdo_fetchcolumn pdo_fetchall 示例: array ...
- dede:channelartlist currentstyle高亮显示
我们在用DEDECMS建站时,常常会做二级栏目的功能,既要用到二级栏目,也就要通过DEDE标签再套标签的方式来实现调用,而DEDECMS多层标签调用只支持channelartlist,也就是说我们只能 ...