HTML标签

w3school关于标签的解析

http://www.w3school.com.cn/tags/

一、body

属性 描述
link rgb(x,x,x)、#xxxxxx、colorname 不赞成使用。请使用样式取代它。规定文档中未访问链接的默认颜色。
alink rgb(x,x,x)、#xxxxxx、colorname 不赞成使用。请使用样式取代它。规定文档中活动链接(active link)的的颜色。
vlink rgb(x,x,x)、#xxxxxx、colorname 不赞成使用。请使用样式取代它。规定文档中已被访问链接的颜色。
background URL 不赞成使用。请使用样式取代它。规定文档的背景图像。
bgcolor rgb(x,x,x)、#xxxxxx、colorname 不赞成使用。请使用样式取代它。规定文档的背景颜色。
text rgb(x,x,x)、#xxxxxx、colorname 不赞成使用。请使用样式取代它。规定文档中所有文本的颜色。

二、换行标签<br>

换行标签是个单标签,也叫空标签,不包含任和内容,在 html 文件中的任何位置只要使用了<br>标 签,当文件显示在浏览器中时,该标签之后的内容将显示下一行。

三、换段落标签<p>

属性 描述
align left、center、right、justify 在 HTML 4.01 中,不赞成使用 p 元素的 align 属性;在 XHTML 1.0 Strict DTD 中,不支持 p 元素的 align 属性。请使用 CSS 代替。CSS 语法:<p style="text-align:right">

justify:对行进行伸展,这样每行都可以有相等的长度(就像在报纸和杂志中),即使每行左右两边顶到边,英文的时候才看得出效果。

四、居中对齐标签<center>

在 HTML 4.01 中,center 元素不被赞成使用。在 XHTML 1.0 Strict DTD 中,center 元素不被支持。
注释:请使用 CSS 样式来居中文本!

五、引文标签 (缩排标签)<blockquote>

<blockquote> 标签定义块引用。<blockquote></blockquote>之间的所有文本都会从常规文本中分离出来,经常会在左、右两边进行缩进(增加外边距),而且有时会使用斜体。也就是说,块引用拥有它们自己的空间。

六、水平分隔线标签<hr>

属性 描述
align left、center、right 不赞成使用。 请使用样式取代它。规定 hr 元素的对齐方式。
noshade noshade 不赞成使用。 请使用样式取代它。规定 hr 元素的颜色呈现为纯色。
size pixels 不赞成使用。 请使用样式取代它。规定 hr 元素的高度(厚度)。默认2像素
width pixels、% 不赞成使用。 请使用样式取代它。规定 hr 元素的宽度。默认100%
color rgb(x,x,x)、#xxxxxx、colorname 不赞成使用。 请使用样式取代它。规定 hr 元素的颜色。

七、署名标签<address>

  • <address> 标签定义文档或文章的作者/拥有者的联系信息。
  • 如果 <address> 元素位于 <body> 元素内,则它表示文档联系信息。
  • 如果 <address> 元素位于 <article> 元素内,则它表示文章的联系信息。
  • <address> 元素中的文本通常呈现为斜体。大多数浏览器会在 address 元素前后添加折行。
提示和注释
  • <address> 标签不应该用于描述通讯地址,除非它是联系信息的一部分。
  • <address> 元素通常连同其他信息被包含在 <footer> 元素中。
HTML 4.01 与 HTML5 之间的差异

HTML 4.01 不支持 <article> 标签,因此在 HTML 4.01 中,<address> 标签始终定义文档作者/拥有者的联系信息。

八、原样显示文字标签<pre>

  • pre 元素可定义预格式化的文本。被包围在 pre 元素中的文本通常会保留空格和换行符。而文本也会呈现为等宽字体。
  • <pre> 标签的一个常见应用就是用来表示计算机的源代码。
  • 可以导致段落断开的标签(例如标题、<p><address>)绝不能包含在<pre>所定义的块里。尽管有些浏览器会把段落结束标签解释为简单地换行,但是这种行为在所有浏览器上并不都是一样的。
  • pre 元素中允许的文本可以包括物理样式基于内容的样式变化,还有链接图像水平分割线。当把其他标签(比如<a>标签)放到 <pre>块中时,就像放在 HTML/XHTML 文档的其他部分中一样即可。
提示和注释
  • 制表符(tab)在 <pre> 标签定义的块当中可以起到应有的作用,每个制表符占据 8 个字符的位置。但是我们不推荐使用它,因为在不同的浏览器中,Tab 的实现各不相同。在用 <pre> 标签格式化的文档段中使用空格,可以确保文本正确的水平位置。
  • 如果您希望使用 <pre> 标签来定义计算机源代码,比如 HTML 源代码,请使用符号实体来表示特殊字符,比如 "<" 代表 "<",">" 代表 ">","&amp" 代表 "&"。

九、特殊字符

在 HTML 文档中,有些字符没办法直接显示出来,例如?. 使用特殊字符可以将键盘上没有的字符表达 出来,而有些 HTML 文档的特殊字符在键盘上虽然可以得到,但浏览器在解析 HTML 文当时会报错,例如 "<"等,为防止代码混淆,必须用一些代码来表示它们。这些代码叫做符号实体

十、标题文字标签 <h1> 到 <h6>

<h1> 定义最大的标题。<h6> 定义最小的标题。

属性 描述
align left、center、right 不赞成使用。 请使用样式取代它。规定标题中文本的排列。

十二、文字格式控制标签<FONT>

属性 描述
color rgb(x,x,x)、#xxxxxx、colorname 不赞成使用。 请使用样式取代它。规定文本的颜色。
face font_family 不赞成使用。 请使用样式取代它。规定文本的字体。
size number 不赞成使用。 请使用样式取代它。规定文本的大小。
提示和注释

请使用样式(代替<font>)来定义文本的字体、颜色和大小

十三、特定文字样式标签

标签 用法 描述
<b> 规定粗体文本 根据 HTML5 规范,在没有其他合适标签更合适时,才应该把 <b> 标签作为最后的选项。也能够使用 CSS“font-weight”属性来设置粗体文本。
<i> 显示斜体文本效果
<u> 定义下划线文本 在 HTML 4.01 中,u 元素是不被推荐使用的.请尽量避免为文本加下划线 - 用户会把它混淆为一个超链接!无
<em> 把文本定义为强调的内容。
<strong> 把文本定义为语气更强的强调的内容。
<cite> 定义引用。 可使用该标签对参考文献的引用进行定义,比如书籍或杂志的标题。
<code> 定义计算机代码文本。
<small> 呈现小号字体效果
<big> 呈现大号字体效果
<samp> 定义样本文本。
<kbd> 定义键盘文本。它表示文本是从键盘上键入的。它经常用在与计算机相关的文档或手册中。
<var> 定义变量。您可以将此标签与 <pre> 及 <code> 标签配合使用。
<dfn> 定义一个定义项目。
<sup> 定义上标文本
<sub> 定义下标文本
实际效果

十四、列表相关

列表中可以嵌套另一个列表

标签 属性 描述
<li> type、value 定义列表项目,可用在有序列表 (<ol>) 和无序列表 (<ul>) 中
<ul> compact、type 定义无序列表
<ol> compact、reversed、start、type 定义有序列表。在 HTML 4.01 中,ol 元素的 "compact"、"start" 以及 "type" 属性是不被赞成使用的。
<dir> compact 定义目录列表
<dl> 定义了定义列表
<dt> 定义了定义列表中的项目
<dd> 在定义列表中定义条目的定义部分
<menu> label、type 目前所有主流浏览器都不支持
属性注释

type:disc(实心圆)、circle(空心圆)、square(小方块)、1(数字)、A(大写英文字母)、a(小写英文字母)、I(大写罗马数字符号)、i(小写罗马数字符号)
compact:任何主流浏览器都不支持compact属性
value:规定列表项目的数字
start:规定有序列表的起始值,值的类型为number

reversed:规定列表顺序为降序。值就是reversed

有序列表和无序列表
目录列表
定义列表

十五、插入图片标签<img>

属性 描述
alt text 规定图像的替代文本
src URL 规定图像的URL
align top、bottom、middle、left、right 不推荐使用。规定如何根据周围的文本来排列图像。
border pixels 不推荐使用。定义图像周围的边框。
height pixels、% 定义图像的高度。通常只设为图片的真实大小以免失真,改变图片大小 最好用图像工具.
hspace pixels 不推荐使用。定义图像左侧和右侧的空白。
ismap URL 将图像定义为服务器端图像映射。当用户在 ismap 图像上单击了某处时,浏览器会自动把鼠标的 x、y 位置(相对于图像的左上角)发送到服务器端。特殊的服务器端软件可以根据这些坐标来做出响应。
longdesc URL 指向包含长的图像描述文档的 URL。
usemap #mapname 将图像定义为客户器端图像映射。# + 要使用的 <map> 元素的 name 或 id 属性
vspace pixels 不推荐使用。定义图像顶部和底部的空白。
width pixels、% 设置图像的宽度。通常只设为图片的真实大小以免失真,改变图片大小 最好用图像工具.
dynsrc URL 指定 avi 文件所在路径
loop number 设定 avi 文件循环次数
loopdelay 设定 avi 文件循环延迟
start fileopen、mouseover 设定文件播放方式网页打开时即播放、当鼠标滑到 avi 文件时播放
lowsrc URL 设定低分辨率图片,若所加入的是一张很大的图片,可先显 示图片。
usemap属性详细解析

usemap 属性提供了一种“客户端”的图像映射机制,有效地消除了服务器端对鼠标坐标的处理,以及由此带来的网络延迟问题。通过特殊的 <map> 和 <area> 标签,HTML 创作者可以提供一个描述 usemap 图像中超链接敏感区域坐标的映射,这个映射同时包含相应的超链接 URL。usemap 属性的值是一个 URL,它指向特殊的 <map> 区域。用户计算机上的浏览器将把鼠标在图像上单击时的坐标转换成特定的行为,包括加载和显示另外一个文档。
我们举例说明一下,下面这段源代码将一个 100x100 像素的图像 map.gif 映射为 4 个区域,当用户单击其中某一个区域时,将被链接到不同的文档中。请注意,在这个 <img> 标签中,我们已经有效地包含了对 ismap 图像映射的处理功能,这样,那些使用不具有 usemap 处理功能的浏览器用户,就可以通过另外一中途径,即服务器端机制来处理图像映射:

<a href="/example/map">
<img src="/i/map.gif" ismap="ismap" usemap="#map" />
</a>

<map name="map">
<area coords="0,0,49,49" href="link1.html">
<area coords="50,0,99,49" href="link2.html">
 <area coords="0,50,49,99" href="link3.html">
<area coords="50,50,99,99" href="link4.html">
</map>

十六、超链接<a>

定义超链接,用于从一张页面链接到另一张页面。

属性 描述
charset char_encoding HTML5中不支持规定被链接文档的字符集。
coords coordinates HTML5中不支持规定链接的坐标。
download filename 规定被下载的超链接目标在下载后的名称。
href URL 规定链接指向的页面的 URL。
hreflang language_code 规定被链接文档的语言。主流的浏览器几乎都不支持 hreflang 属性。
media media_query 规定被链接文档是为何种媒介/设备优化的。
name section_name HTML5中不支持规定锚的名称
rel text 规定当前文档与被链接文档之间的关系。
rev text HTML5中不支持规定被链接文档与当前文档之间的关系。
shape default、rect、circle、poly HTML5中不支持规定链接的形状。
target _blank、_parent、_self、_top、framename 规定在何处打开链接文档。
type MIME type 规定被链接文档的的 MIME 类型。该属性是 HTML5 中 a 元素的新属性。

如果不使用 href 属性,则不可以使用如下属性:download, hreflang, media, rel, target 以及 type 属性。

属性详细解析
  • href属性:
  • 绝对 URL - 指向另一个站点
  • 相对 URL - 指向站点内的某个文件
  • 锚 URL - 指向页面中的锚(href="#top")
  • shape属性:

default:规定全部区域
rect:定义矩形区域
circle:定义圆形
poly:定义多边形区域

  • target属性:

_blank:在新窗口中打开被链接文档
_self:默认。在相同的框架中打开被链接文档。
_parent :在父框架集中打开被链接文档。
_top:在整个窗口中打开被链接文档。
framename:在指定的框架中打开被链接文档。

  • name属性使用实例


    name属性的使用
1、发送E-main

参数列表

参数 含义
to 收信人
suject 主题
cc 抄送
bcc 暗抄送
body 内容

参数传递方式同页面之间传递值一样,可以使用查询字符串,也可以用form
querystring方式:
<a href="mailto:sample@163.com?subject=test&cc=sample@hotmail.com&body=use mailto sample">send mail</a>
form方式:

<form name='sendmail' action='mailto:sample@163.com'>
    <input name='cc' type='text' value='sample@hotmail.com'>
    <input name='subject' type='text' value='test'>
    <input name='body' type='text' value='use mailto sample'>
</form>

两种方式同样传递所有参数。
用鼠标单击一下该超级连接的话,浏览器会自动调用系统默认的邮件客户端程序,同时按照设定好的变量值,如subject、cc等,在邮件客户端中自动填入设定好的值。
如果要将邮件发送到多个邮箱,可以使用分号";"隔开,如下所示:
<a href="mailto:sample@163.com;abc@qq.com?subject=test&cc=sample@hotmail.com&body=use mailto sample">send mail</a>
如果想使邮件内容(变量body对应的变量值)换行,则直接加上<br>标签,如下所示:
<a href="mailto:sample@163.com?subject=test&cc=sample@hotmail.com&body=use<br>mailto sample">send mail</a>

2、ftp

格式:ftp://帐号:密码@FTP网址
eg.

帐号:wangfei
密码:88888888
FTP网址为:www.iefans.net
<a href="ftp://wangfei:88888888@www.wangfei.net"> 王飞FTP</a>

3、图像的超链接
<a href="http://baidu.com">
    <img src="http://img0.imgtn.bdimg.com/it/u=2472221060,3111898232&fm=26&gp=0.jpg">
</a>
4、点播音乐
<a href="http://www.luyin.com/upload/beibeixiongtongzhuang0821013.mp3">音乐</a>

十七、表格<table>

相关标签 描述
<caption> 定义表格的标题。在表格中也可以不用此 标签。
<th> 定义表头单元格。表格中的文字将以粗体 显示,在表格中也可以不用此标签,<th> 标签必须放在<tr>标签内
<tr> 定义一行标签,一组行标签内可以建立多 组由<td><th>标签所定义的单元格
<td> 定义单元格标签,一组<td>标签将将建 立一个单元格,<td>标签必须放在<tr>标签内
<caption>属性 描述
align left、right、top、bottom 不赞成使用。请使用样式取而代之。分别固定规定标题在表格的左、右、上、下

注释 :除了 Firefox,其他主流浏览器都无法正确地支持 align 属性。
所有主流浏览器都支持 "top" 和 "bottom" 值。Chrome 和 Safari 不支持 "left" 和 "right"。Internet Explorer 和 Opera 只能对 caption 内部的文本(而不是整个 caption 元素)进行对齐。

<table>属性 描述
align left、center、right 不赞成使用请使用样式代替。规定表格相对周围元素的对齐方式。
bgcolor rgb(x,x,x)、#xxxxxx、colorname 不赞成使用请使用样式代替。规定表格的背景颜色。
border pixels 规定表格边框的宽度。
bordercolor rgb(x,x,x)、#xxxxxx、colorname 表格边框颜色。当 border>=1 时起作用
bordercolorlight rgb(x,x,x)、#xxxxxx、colorname 表格边框明亮部分颜色。当 border>=1 时起作用
bordercolordark rgb(x,x,x)、#xxxxxx、colorname 表格边框昏暗部分颜色。当 border>=1 时起作用
cellpadding pixels、% 规定单元边沿与其内容之间的空白。
cellspacing pixels、% 规定单元格之间的空白。
frame void、above、below、hsides、lhs、rhs、vsides、box、border 规定外侧边框的哪个部分是可见的。从实用角度出发,最好不要规定 frame,而是使用 CSS 来添加。除了 Internet Explorer,其他浏览器都支持 frame 属性。
rules none、groups、rows、cols、all 规定内侧边框的哪个部分是可见的。
summary text 规定表格的摘要。该属性不会对普通浏览器中产生任何视觉变化。屏幕阅读器可以利用该属性。
width pixels、% 规定表格的宽度。
height pixels、% 规定表格的高度。
<tr>属性 描述
height number 行高
align left、center、right、justify、char 定义表格行的对齐方式。
bgcolor rgb(x,x,x)、#xxxxxx、colorname 不赞成使用请使用样式代替。规定表格行的背景颜色。
char character 几乎没有浏览器支持规定根据哪个字符来进行文本对齐
charoff number 规定第一个对齐字符的偏移量,和char属性配合使用
valign top、middle、bottom、baseline 规定表格行中内容的垂直对齐方式
<td>/<th>属性 描述
align left、center、right、justify、char 规定单元格内容的水平对齐方式。
valign top、middle、bottom、baseline 规定单元格内容的垂直排列方式
axis category_name 对单元进行分类。
bgcolor rgb(x,x,x)、#xxxxxx、colorname 不赞成使用请使用样式代替。规定单元格的背景颜色。
colspan number 规定单元格可横跨的列数。
rowspan number 规定单元格可横跨的行数。
height/width pixels、% 不赞成使用请使用样式代替。规定表格单元格的高度和宽度,会影响对应行和列的高度。
scope col、colgroup、row、rowgroup 定义将表头数据与单元数据相关联的方法。
nowrap nowrap 不赞成使用请使用样式取而代之。规定单元格中的内容是否折行。
<td>/<th>的scope属性
  • col 规定单元格是列的表头。
  • row 规定单元格是行的表头。
  • colgroup 规定单元格是列组的表头。
  • rowgroup 规定单元格是行组的表头。
scope属性效果
表格的分组
  • 按行分组

html 文档的表格按行分组是由表头标签<thead>、表格主体标签<tbody>和尾注标签<tfoot>三个 部分组成的。<tbody>标签用于规定表格主体部分的元素,可出现多次。

<thead>/<tbody>/<tfoot>属性 描述
align left、center、right、justify、char 规定元素内的单元格内容的水平对齐方式。只有 Internet Explorer 和 Opera 支持 align 属性。
valign top、middle、bottom、baseline 规定元素内的单元格内容的垂直排列方式。只有 Internet Explorer 和 Opera 支持 valign 属性。
表格行分组实例

提示
在默认情况下<thead>、<tbody>、<tfoot>元素不会影响到表格的布局。不过,您可以使用 CSS 使这些元素改变表格的外观。

  • 按列分组

html 使用<colgroup>标签来将表格按列分组。
Firefox、Chrome 以及 Safari 仅支持 colgroup 元素的 span 和 width 属性。

属性 描述
span number 规定列组相应横跨的列数
width pixels、%、relative_length 规定列组合中列的宽度
表格列分组实例
表格的嵌套
表格嵌套实例

十八、插入多媒体文件<embed>

<embed> 标签是 HTML 5 中的新标签。

属性 描述
height pixels 设置嵌入内容的高度
width pixels 设置嵌入内容的宽度
src url 嵌入内容的url
type MIME_type 定义嵌入内容的类型

十九、多视图窗口框架<frameset>

<frameset> 可定义一个框架集。它被用来组织多个窗口(框架)。<frameset>内可以嵌套<frameset>。
 html 页面的文档体标签<body>被框架集标签 <frameset>所取代,然后通过<frameset>的子窗口标签<frame>定义每一个子窗口和子窗口的页面属性。Frame 子框架的 src 属性的 URL 值指定了一个 html 文件(这个文件必须事先做好)地址,地址路径可使用绝对路径或相对路径,这个文件将载入相应的窗口中。
 <frameset> 标签有一个必需的属性:要么是 rows,要么是 cols,这取决于您的选择,它们定义了文档窗口中框架或嵌套的框架集的行或列的大小及数目。
 这两个属性都接受用引号括起来并用逗号分开的值列表,这些数值指定了框架的绝对(像素点)或相对(百分比或其余空间)宽度(对列而言),或者绝对或相对高度(对行而言)。这些属性值的数目决定了浏览器将会在文档窗口中显示多少行或列的框架。

属性 描述
cols pixels、%、* 定义框架中列的数目和尺寸
rows pixels、%、* 定义框架集中行的数目和尺寸

border

注释:

您不能与 <frameset></frameset> 标签一起使用 <body></body> 标签。不过,如果您需要为不支持框架的浏览器添加一个 <noframes> 标签,请务必将此标签放置在 <body></body> 标签中!

<noframes>的使用
<noframes>的使用
<frameset>实例

二十、子窗口<frame>

<frame> 标签定义 frameset 中的一个特定的窗口(框架)。

属性 描述
frameborder 0、1 规定是否显示框架周围的边框。出于实用性方面的原因,最好不用设置该属性,请使用 CSS 来应用边框样式和颜色
longdesc url 规定一个包含有关框架内容的长描述的页面。
marginheight pixels 定义框架的上方和下方的边距。
marginwidth pixels 定义框架的左侧和右侧的边距。
name name 规定框架的名称。
noresize noresize 规定无法调整框架的大小。
scrolling yes、no、auto 规定是否在框架中显示滚动条。
scr url 规定在框架中显示的文档的 URL。

二十一、浮动窗口<iframe>

属性 描述
align left、right、top、middle、bottom 不赞成使用。请使用样式代替。规定如何根据周围的元素来对齐此框架。
frameborder 1、0 规定是否显示框架周围的边框
height pixels、% 规定ifram的高度
width pixels、% 规定ifram的宽度
longdesc url 规定一个页面,该页面包含有关iframe的较长描述
marginheight pixels 定义iframe的顶部和底部边距
marginwidht pixels 定义iframe的左侧和右侧的边距
name frame_name 规定iframe的名称。
sandbox “” 、 allow-forms、allow-same-origin、allow-scripts、allow-top-navigation 启用一系列对<iframe>中内容的额外限制。
scrolling yes、no、auto 规定是否在iframe中显示滚动条
seamless seamless 规定<iframe>看上去是否包含文档的一部分。IE和firefox不支持该属性
src url 规定iframe中显示的文档url。
srcdoc HTML_code 规定<iframe>中显示的页面的html内容。

二十二、表单<form>

  • <form> 标签用于为用户输入创建 HTML 表单。
  • 表单能够包含input、menus、textarea、fieldset、legend和label元素
  • 表单用于向服务器传输数据
属性 描述
accept MIME_type HTML5中不支持
accept-charset charset_list 规定服务器可处理的表单数据字符集。
action url 规定当提交表单时向何处发送表达数据。
autocomplete on、off 规定是否用表单的自动完成功能
enctype 规定在发送表单数据之前如何对其进行编码
method get、post 规定用于发送form-data的HTTP方法
name form_name 规定表单的名称,name 属性提供了一种在脚本中引用表单的方法。
novalidate novalidate 如果使用该属性,则提交表单时不尽兴验证。
target _blank、_self、_parent、_top、_framename 规定在何处打开actionURL。
enctype 属性可能的值:
  • application/x-www-form-urlencoded
  • multipart/form-data
  • text/plain

二十三、<input>

  • <input> 标签用于搜集用户信息。
  • 根据不同的 type 属性值,输入字段拥有很多种形式。输入字段可以是文本字段、复选框、掩码后的文本控件、单选按钮、按钮等等。
  • 请使用label元素为某个表单控件定义标签
  • 只有设置了 name 属性的表单元素才能在提交表单时传递它们的值。
属性 描述
accept mime_type 规定通过文件上传来提交的文件的类型。只能与 <input type="file"> 配合使用。请避免使用该属性。应该在服务器端验证文件上传。
align left、right、top、middle、bottom 不赞成使用。规定图像输入的对齐方式。只能与 <input type="image"> 配合使用
alt text 定义图像输入的替代文本
autocomplete on、off 规定是否使用输入字段的自动完成功能。自动完成允许浏览器预测对字段的输入。当用户在字段开始键入时,浏览器基于之前键入过的值,应该显示出在字段中填写的选项。
autofocus autofocus 规定输入字段在页面加载时是否获得焦点(不适用于type=“hidden”)
checked checked 规定此input元素首次加载时应当被选中。与 <input type="checkbox"> 或 <input type="radio"> 配合使用。
disabled disabled 当input元素加载时禁止用此元素
form formname 规定输入字段所属一个或多个表单。form 属性的值必须是其所属表单的 id。如需引用一个以上的表单,请使用空格分隔的列表。
formaction url 覆盖表单的action属性。(适用于type=“submit”和type=“image”)
formenctype 覆盖表单的enctype属性。(适用于 type=“submit”和type=“image”)
formmethod get、post 覆盖表单的method属性。(适用于 type=“submit”和type=“image”)
formnovalidate formnovalidate 覆盖表单的novalidate属性。如果使用该属性,则提交表单的时候不验证。
formtarget _blank、_self、_parent、_top、_framename 覆盖表单的target属性。(适用于 type=“submit”和type=“image”)
height pixels、% 定义input字段的高度。(适用于type=“image”)
list datalist-id 引用包含输入字段的预定义选项的datalist。
max number、date 规定输入字段的最大值。请与“min”属性配合使用,来创建合法值的范围
maxlength number 规定输入字段中的字符的最大长度
min number、date 规定输入字段的最小值。请与“max”属性配合使用,来创建合法值的范围
multiple multiple 如果使用该属性,则允许一个以上的值。
name field_name 定义input元素的名称。用于对提交到服务器后的表单数据进行标识,或者在客户端通过 JavaScript 引用表单数据。只有设置了 name 属性的表单元素才能在提交表单时传递它们的值。
pattern regexp_pattern 规定输入字段的值的模式或者格式。例如pattern=“[0-9]"表示输入值必须试0与9之间的数字。使用的是正则表达式。请使用标准的 "title" 属性来描述模式,当提交的时候,检测到输入不符合格式会提示“title”文字
placeholder text 规定帮助用户填写输入字段的提示
readonly readonly 规定输入字段为只读。属性可与 <input type="text"> 或 <input type="password"> 配合使用。可以 使用JavaScript 消除 readonly 值,将输入字段切换到可编辑状态。
required required 规定输入字段的值是必须的
size number_of_char 定义输入字段的宽度。对于 <input type="text"> 和 <input type="password">,size 属性定义的是可见的字符数。而对于其他类型,size 属性定义的是以像素为单位的输入字段宽度。具体效果为调节输入框长度。由于 size 属性是一个可视化的设计属性,推荐您使用 CSS (<input style="width:100px" />)来代替它。
src url 定义以提交按钮形式显示的图像的url。只能与 <input type="image"> 配合使用。
step number 规定输入字的合法数字间隔
type button、checkbox、file、hidden、image、password、radio、reset、submit、text 规定input元素的类型
value value 规定input元素的值
width pixels、% 定义input字段的宽度。(适用于type=“image”)
type属性各种值的效果
input type属性效果
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 206,839评论 6 482
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 88,543评论 2 382
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 153,116评论 0 344
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 55,371评论 1 279
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 64,384评论 5 374
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 49,111评论 1 285
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,416评论 3 400
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 37,053评论 0 259
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 43,558评论 1 300
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 36,007评论 2 325
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 38,117评论 1 334
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,756评论 4 324
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,324评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,315评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,539评论 1 262
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 45,578评论 2 355
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,877评论 2 345

推荐阅读更多精彩内容

  • HTML标签解释大全 一、HTML标记 标签:!DOCTYPE 说明:指定了 HTML 文档遵循的文档类型定义(D...
    米塔塔阅读 3,225评论 1 41
  • 标签 描述 <!--...--> 定义注释。 <!DOCTYPE> 定义文档类型。 定义锚。 定义缩写。 定义只取...
    斜错刀阅读 667评论 0 0
  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 13,728评论 1 92
  • 今天有机会将css的内容重新总结一次也是一件极好的事,从较基本的总结一遍,也便于对基本概念的更深入的理解。 HTM...
    gyc0530阅读 764评论 0 3
  • 你会不会问―― 风总是吹,吹哪儿去了? 河不停流,流哪儿去了? 我知道你不会, 问的是我。 一切好似从未发生过, ...
    胡薷薷阅读 101评论 0 1