HTML基础篇(标签和属性整--已剔除不被浏览器支持的部分)

行内元素有:a b span img input select strong 
块级元素有:div ul ol li dl dt dd h1 h2 h3 h4…p  

HTML 参考手册- (HTML5 标准)


功能排序

New : HTML5 新标签

标签描述
基础 
<!DOCTYPE> 定义文档类型。
<html>定义一个 HTML 文档
<title>为文档定义一个标题
<body>定义文档的主体
<h1> to <h6>定义 HTML 标题
<p>定义一个段落
<br>定义简单的折行。
<hr>定义水平线。
<!--...-->定义一个注释
格式 
  
<abbr>定义一个缩写。
  
<b>定义粗体文本。
  
<bdo>定义文本的方向。
  
<blockquote>定义块引用。
  
  
<del>定义被删除文本。
  
<em>定义强调文本。 斜体。
  
<i>定义斜体文本。
<ins>定义被插入文本。下划线。
  
<mark>New定义带有记号的文本。黄色高亮。
<meter>New定义度量衡。仅用于已知最大和最小值的度量。(类似进度条的效果,很明显)
<pre>定义预格式文本。写好的格式(比如空格和空行)不会消失。
<progress>New定义运行中的任务进度(进程)。哦我错了,原来这个才是进度条。
<q>定义短的引用。自动加上双引号而已。
  
<rt>New定义字符(中文注音或字符)的解释或发音。
<ruby>New定义 ruby 注释(中文注音或字符)。
<s>定义加删除线的文本。效果和<del>相同
  
  
  
<strong>定义语气更为强烈的强调文本。
<sub>定义下标文本。
<sup>定义上标文本。
<time>New定义一个日期/时间。效果是对于搜索引擎。
  
<u>定义下划线文本。和<ins>效果一样。
  
<wbr>New规定在文本中的何处适合添加换行符。
表单 
<form>

定义一个 HTML 表单,用于用户输入。

New :HTML5 中的新属性。

属性描述
   
accept-charsetcharacter_set规定服务器可处理的表单数据字符集。
actionURL规定当提交表单时向何处发送表单数据。
autocompleteNewon
off
规定是否启用表单的自动完成功能。
enctypeapplication/x-www-form-urlencoded
multipart/form-data
text/plain
规定在向服务器发送表单数据之前如何对其进行编码。(适用于 method="post" 的情况)
methodget
post
规定用于发送表单数据的 HTTP 方法。
nametext规定表单的名称。
novalidateNewnovalidate如果使用该属性,则提交表单时不进行验证。
target_blank
_self
_parent
_top
规定在何处打开 action URL。
<input>

定义一个输入控件

属性

New : HTML5新标签。

属性描述
acceptaudio/* video/* image/* MIME_type规定通过文件上传来提交的文件的类型。 (只针对type="file")
   
alttext定义图像输入的替代文本。 (只针对type="image")
autocompleteNewon offautocomplete 属性规定 <input> 元素输入字段是否应该启用自动完成功能。
autofocusNewautofocus属性规定当页面加载时 <input> 元素应该自动获得焦点。
checkedcheckedchecked 属性规定在页面加载时应该被预先选定的 <input> 元素。 (只针对 type="checkbox" 或者 type="radio")
disableddisableddisabled 属性规定应该禁用的 <input> 元素。
formNewform_idform 属性规定 <input> 元素所属的一个或多个表单。
formactionNewURL属性规定当表单提交时处理输入控件的文件的 URL。(只针对 type="submit" 和 type="image")
formenctypeNewapplication/x-www-form-urlencoded multipart/form-data text/plain属性规定当表单数据提交到服务器时如何编码(只适合 type="submit" 和 type="image")。
formmethodNewget post定义发送表单数据到 action URL 的 HTTP 方法。 (只适合 type="submit" 和 type="image")。覆盖form的method方法!
formnovalidateNewformnovalidateformnovalidate 属性覆盖 <form> 元素的 novalidate 属性。
formtargetNew_blank _self _parent _top framename规定表示提交表单后在哪里显示接收到响应的名称或关键词。(只适合 type="submit" 和 type="image")
heightNewpixels规定 <input>元素的高度。(只针对type="image")
listNewdatalist_id属性引用 <datalist> 元素,其中包含 <input> 元素的预定义选项。
maxNewnumber date

属性规定 <input> 元素的最大值。

定义和用法

max 属性规定 <input> 元素的最大值。

提示:max 属性与 min 属性配合使用,可创建合法值范围。

注意:max 和 min 属性适用于以下 input 类型:number、range、date、datetime、datetime-local、month、time 和 week。

maxlengthnumber属性规定 <input> 元素中允许的最大字符数。
minNewnumber date属性规定 <input>元素的最小值。
multipleNewmultiple

属性规定允许用户输入到 <input> 元素的多个值。

定义和用法

multiple 属性是一个布尔属性。

multiple 属性规定允许用户输入到 <input> 元素的多个值。

注意:multiple 属性适用于以下 input 类型:email 和 file。

nametextname 属性规定 <input> 元素的名称。
patternNewregexp

pattern 属性规定用于验证 <input> 元素的值的正则表达式。

定义和用法

pattern 属性规定用于验证 <input> 元素的值的正则表达式。

注意:pattern 属性适用于下面的 input 类型:text、search、url、tel、email 和 password。

提示:请使用全局的 title 属性来描述模式以帮助用户。

提示:可以在我们的 JavaScript 教程中学习更多有关 正则表达式 的知识。

placeholderNewtextplaceholder 属性规定可描述输入 <input> 字段预期值的简短的提示信息 。
readonlyreadonlyreadonly 属性规定输入字段是只读的。
requiredNewrequired属性规定必需在提交表单之前填写输入字段。
sizenumbersize 属性规定以字符数计的 <input> 元素的可见宽度。
srcURLsrc 属性规定显示为提交按钮的图像的 URL。 (只针对 type="image")
stepNewnumber

step 属性规定 <input> 元素的合法数字间隔。

定义和用法

step 属性规定 <input> 元素的合法数字间隔。

实例:如果 step="3",则合法数字应该是 -3、0、3、6,以此类推。

提示:step 属性可以与 max 和 min 属性配合使用,以创建合法值的范围。

注意:step 属性适用于下面的 input 类型:number、range、date、datetime、datetime-local、month、time 和 week。

typebutton 
checkbox 
color 
date 
datetime 
datetime-local 
email 
file 
hidden 
image 
month 
number 
password 
radio 
range 
reset 
search 
submit 
tel 
text 
time 
url 
week
button定义可点击的按钮(大多与 JavaScript 使用来启动脚本)
checkbox定义复选框。
color定义拾色器。
date定义日期字段(带有 calendar 控件)
datetime定义日期字段(带有 calendar 和 time 控件)
datetime-local定义日期字段(带有 calendar 和 time 控件)
month定义日期字段的月(带有 calendar 控件)
week定义日期字段的周(带有 calendar 控件)
time定义日期字段的时、分、秒(带有 time 控件)
email定义用于 e-mail 地址的文本字段
file定义输入字段和 "浏览..." 按钮,供文件上传
hidden定义隐藏输入字段
image定义图像作为提交按钮
number定义带有 spinner 控件的数字字段
password定义密码字段。字段中的字符会被遮蔽。
radio定义单选按钮。
range定义带有 slider 控件的数字字段。
reset定义重置按钮。重置按钮会将所有表单字段重置为初始值。
search定义用于搜索的文本字段。
submit定义提交按钮。提交按钮向服务器发送数据。
tel定义用于电话号码的文本字段。
text默认。定义单行输入字段,用户可在其中输入文本。默认是 20 个字符。
url定义用于 URL 的文本字段。
valuetext

指定 <input> 元素 value 的值。

定义和用法

value 属性规定 <input> 元素的值。

value 属性对于不同 input 类型,用法也不同:

  • 对于 "button"、"reset"、"submit" 类型 - 定义按钮上的文本
  • 对于 "text"、"password"、"hidden" 类型 - 定义输入字段的初始(默认)值
  • 对于 "checkbox"、"radio"、"image" 类型 - 定义与 input 元素相关的值,当提交表单时该值会发送到表单的 action URL。

注意:value 属性对于 <input type="checkbox"> 和 <input type="radio"> 是必需的。

注意:value 属性不适用于 <input type="file">。

widthNewpixelswidth 属性规定 <input> 元素的宽度。 (只针对type="image")
<textarea>

定义多行的文本输入控件。

属性

New:HTML5 中的新属性。

属性描述
autofocusNewautofocus规定当页面加载时,文本区域自动获得焦点。
colsnumber规定文本区域内可见的列数。
disableddisabled规定禁用文本区域。
formNewform_id定义文本区域所属的一个或多个表单。
maxlengthNewnumber规定文本区域允许的最大字符数。
nametext规定文本区域的名称。
placeholderNewtext规定一个简短的提示,描述文本区域期望的输入值。
readonlyreadonly规定文本区域为只读。
requiredNewrequired规定文本区域是必需的/必填的。
rowsnumber规定文本区域内可见的行数。
wrapNewhard
soft
规定当提交表单时,文本区域中的文本应该怎样换行。
<button>

定义按钮。

autofocusNewautofocus规定当页面加载时按钮应当自动地获得焦点。
disableddisabled规定应该禁用该按钮。
formNewform_id规定按钮属于一个或多个表单。
formactionNewURL规定当提交表单时向何处发送表单数据。覆盖 form 元素的 action 属性。该属性与 type="submit" 配合使用。
formenctypeNewapplication/x-www-form-urlencoded
multipart/form-data
text/plain
规定在向服务器发送表单数据之前如何对其进行编码。覆盖 form 元素的 enctype 属性。该属性与 type="submit" 配合使用。
formmethodNewget
post
规定用于发送表单数据的 HTTP 方法。覆盖 form 元素的 method 属性。该属性与 type="submit" 配合使用。
formnovalidateNewformnovalidate如果使用该属性,则提交表单时不进行验证。覆盖 form 元素的 novalidate 属性。该属性与 type="submit" 配合使用。
formtargetNew_blank
_self
_parent
_top
framename
规定在何处打开 action URL。覆盖 form 元素的 target 属性。该属性与 type="submit" 配合使用。
namename规定按钮的名称。
typebutton
reset
submit 
规定按钮的类型。
valuetext规定按钮的初始值。可由脚本进行修改。
<select>

定义选择列表(下拉列表)。

属性

New:HTML5 中的新属性。

属性描述
autofocusNewautofocus规定在页面加载时下拉列表自动获得焦点。
disableddisabled当该属性为 true 时,会禁用下拉列表。
formNewform_id定义 select 字段所属的一个或多个表单。
multiplemultiple当该属性为 true 时,可选择多个选项。
namename定义下拉列表的名称。
requiredNewrequired规定用户在提交表单前必须选择一个下拉列表中的选项。
sizenumber规定下拉列表中可见选项的数目。
<optgroup>定义选择列表中相关选项的组合。
<option>

定义选择列表中的选项。

属性

属性描述
disableddisabled规定此选项应在首次加载时被禁用。
labeltext定义当使用 <optgroup> 时所使用的标注。
selectedselected规定选项(在首次显示在列表中时)表现为选中状态。
valuetext定义送往服务器的选项值。
<label>定义 input 元素的标注。
<fieldset>定义围绕表单中元素的边框。
<legend>定义 fieldset 元素的标题。
<datalist>New规定了 input 元素可能的选项列表。与input标签的data属性联合使用。
<keygen>New规定用于表单的密钥对生成器字段。
<output>New定义一个计算的结果
框架 
  
<iframe>

定义内联框架。

标签定义及使用说明

<iframe> 标签规定一个内联框架。

一个内联框架被用来在当前 HTML 文档中嵌入另一个文档。

图像 
<img>定义图像。
<map>定义图像映射。<map> 标签用于客户端图像映射。图像映射指带有可点击区域的一幅图像。
<area>

定义图像地图内部的区域。

alttext规定区域的替代文本。如果使用 href 属性,则该属性是必需的。
coordscoordinates规定区域的坐标。
hrefURL规定区域的目标 URL。
hreflangNewlanguage_code规定目标 URL 的语言。
mediaNewmedia query规定目标 URL 是为何种媒介/设备优化的。默认:all。
nohrefvalueHTML5 不支持。 规定没有相关链接的区域。
relNewalternate
author
bookmark
help
license
next
nofollow
noreferrer
prefetch
prev
search
tag
规定当前文档与目标 URL 之间的关系。
shapedefault
rect
circle
poly
规定区域的形状。
target_blank
_parent
_self
_top
framename
规定在何处打开目标 URL。
typeNewMIME_type规定目标 URL 的 MIME 类型。
注:MIME = Multipurpose Internet Mail Extensions。
<canvas>New通过脚本(通常是 JavaScript)来绘制图形(比如图表和其他图像)。<canvas> 标签只是图形容器,您必须使用脚本来绘制图形。
<figcaption>New

<figcaption> 标签为 <figure> 元素定义标题。

<figcaption> 元素应该被置于 <figure> 元素的第一个或最后一个子元素的位置。

<figure>Newfigure 标签用于对元素进行组合。<figure> 标签规定独立的流内容(图像、图表、照片、代码等等)。
Audio/Video 
<audio>New

定义声音,比如音乐或其他音频流。

属性

New :HTML5 中的新属性。

属性描述
autoplayNewautoplay如果出现该属性,则音频在就绪后马上播放。
controlsNewcontrols如果出现该属性,则向用户显示音频控件(比如播放/暂停按钮)。
loopNewloop如果出现该属性,则每当音频结束时重新开始播放。
mutedNewmuted如果出现该属性,则音频输出为静音。
preloadNewauto
metadata
none
规定当网页加载时,音频是否默认被加载以及如何被加载。
srcNewURL规定音频文件的 URL。
<source>New定义media元素 (<video> 和 <audio>)的媒体资源。media
<track>New

为媒体(<video> 和 <audio>)元素定义外部文本轨道。

属性描述
defaultNewdefault规定该轨道是默认的。如果用户没有选择任何轨道,则使用默认轨道。
kindNewcaptions
chapters
descriptions
metadata
subtitles
规定文本轨道的文本类型。
labelNewtext规定文本轨道的标签和标题。
srcNewURL必需的。规定轨道文件的 URL。
srclangNewlanguage_code规定轨道文本数据的语言。如果 kind 属性值是 "subtitles",则该属性是必需的。
<video>New

定义一个音频或者视频

New:HTML5 中的新属性。

属性描述
autoplayNewautoplay如果出现该属性,则视频在就绪后马上播放。
controlsNewcontrols如果出现该属性,则向用户显示控件,比如播放按钮。
heightNewpixels设置视频播放器的高度。
loopNewloop如果出现该属性,则当媒介文件完成播放后再次开始播放。
mutedNewmuted如果出现该属性,视频的音频输出为静音。
posterNewURL规定视频正在下载时显示的图像,直到用户点击播放按钮。
preloadNewauto
metadata
none
如果出现该属性,则视频在页面加载时进行加载,并预备播放。如果使用 "autoplay",则忽略该属性。
srcNewURL要播放的视频的 URL。
widthNewpixels设置视频播放器的宽度。
链接 
<a>

定义一个链接

属性

New :HTML5 中的新属性。

属性描述
   
downloadNewfilename指定下载链接
hrefURL规定链接的目标 URL。
hreflanglanguage_code规定目标 URL 的基准语言。仅在 href 属性存在时使用。
mediaNewmedia_query规定目标 URL 的媒介类型。默认值:all。仅在 href 属性存在时使用。
namesection_nameHTML5 不支持。规定锚的名称。
relalternate
author
bookmark
help
license
next
nofollow
noreferrer
prefetch
prev
search
tag
规定当前文档与目标 URL 之间的关系。仅在 href 属性存在时使用。
   
   
target_blank
_parent
_self
_top
framename
规定在何处打开目标 URL。仅在 href 属性存在时使用。
typeNewMIME_type规定目标 URL 的 MIME 类型。仅在 href 属性存在时使用。
注:MIME = Multipurpose Internet Mail Extensions。
<link>定义文档与外部资源的关系。
<nav>New

定义导航链接

<nav> 标签定义导航链接的部分。

并不是所有的 HTML 文档都要使用到 <nav> 元素。<nav> 元素只是作为标注一个导航链接的区域。

列表 
<ul>定义一个无序列表
<ol>定义一个有序列表
<li>定义一个列表项
  
<dl>定义一个定义列表
<dt>定义一个定义定义列表中的项目。
<dd>定义定义列表中项目的描述。
  
  
表格 
<table>定义一个表格
<caption>定义表格标题。
<th>定义表格中的表头单元格。
<tr>定义表格中的行。
<td>定义表格中的单元。
<thead>定义表格中的表头内容。
<tbody>定义表格中的主体内容。
<tfoot>定义表格中的表注内容(脚注)。
<col>定义表格中一个或多个列的属性值。和下面的colgroup配合使用。
spannumber规定 <col> 元素应该横跨的列数。
<colgroup>定义表格中供格式化的列组。
样式/节 
<style>定义文档的样式信息。
<div>定义文档中的节。
<span>定义文档中的节。
<header>New定义一个文档头部部分
<footer>New定义一个文档底部
<section>New定义了文档的某个区域
<article>New定义一个文章内容
<aside>New定义其所处内容之外的内容。
  
元信息 
<head>定义关于文档的信息
<meta>定义关于 HTML 文档的元信息。
<base>

定义页面中所有链接的默认地址或默认目标。

属性

属性描述
hrefURL规定页面中所有相对链接的基准 URL。
target_blank
_parent
_self
_top
framename
规定页面中所有的超链接和表单在何处打开。该属性会被每个链接中的 target 属性覆盖。
  
程序 
<script>定义客户端脚本。
<noscript>定义针对不支持客户端脚本的用户的替代内容。
  
<embed>New

定义了一个容器,用来嵌入外部应用或者互动程序(插件)。

属性

New :HTML5 中的新属性。

属性描述
heightNewpixels规定嵌入内容的高度。
srcNewURL规定被嵌入内容的 URL。
typeNewMIME_type规定嵌入内容的 MIME 类型。
注:MIME = Multipurpose Internet Mail Extensions。
widthNewpixels规定嵌入内容的宽度。
  

HTML 全局属性


New : HTML5 新属性。

属性描述
accesskey设置访问元素的键盘快捷键。
class规定元素的类名(classname)
contenteditableNew规定是否可编辑元素的内容。
  
data-*New

用于存储页面的自定义数据

定义和用法

data-* 属性用于存储私有页面后应用的自定义数据。

data-* 属性可以在所有的 HTML 元素中嵌入数据。

自定义的数据可以让页面拥有更好的交互体验(不需要使用 Ajax 或去服务端查询数据)。

data-* 属性由以下两部分组成:

  1. 属性名不要包含大写字母,在 data- 后必须至少有一个字符。
  2. 该属性可以是任何字符串

注意: 自定义属性前缀 "data-" 会被客户端忽略。

dir设置元素中内容的文本方向。
draggableNew指定某个元素是否可以拖动
  
hiddenNewhidden 属性规定对元素进行隐藏。
id规定元素的唯一 id
lang设置元素中内容的语言代码。
  
style规定元素的行内样式(inline style)
  
title

规定元素的额外信息(可在工具提示中显示)

定义和用法

title 属性规定关于元素的额外信息。

这些信息通常会在鼠标移到元素上时显示一段工具提示文本(tooltip text)。

translateNew指定是否一个元素的值在页面载入时是否需要翻译

转载于:https://www.cnblogs.com/cndotabestdota/p/5688981.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值