02/07
2014

##html4 标签通用属性

  • accesskey:规定激活元素的快捷键:如a标签:accesskey="c"
  • dir:规定元素中内容的文本方向,只能为ltr|rtl
  • lang:规定元素的语言,<p lang="fr">Ceci est un paragraphe.</p>,注意lang在某些标签中是无效的如<iframe><br>

  • tabIndex class id style title

##表单

###form属性

  • target:规定在何处打开action URL,值为:_blank(新建窗口) _self(自己所在窗口) _parent(父窗口) _top(最顶层的窗口) framename(指定的frame的name)
  • enctype:规定在发送表单数据之前如何对其进行编码。值为:application/x-www-form-urlencoded multipart/form-data text/plain
  • action method name

###input

  • form中的文本标签基本都有value name disabled readonly 属性
  • alt checked src
  • maxlength:规定文本的最大长度
  • size:定义输入字段的宽度
  • type:可以为以下值:button checkbox file hidden image password radio reset submit text

###textarea

  • rows cols

###button

  • type:规定button的type,值为:button reset submit

reset可以重置form非隐藏域(type=”hidden”)的值为初始值.如果全都重置,使用style="display:none;",对应js form.reset()

###label

  • for:规定该label绑定到哪个表单元素上,为表单元素的id。如果点击了label中的文字,就会触发绑定的表单控件。

###select

  • multiple:规定可以选择多项。值为:multiple
  • size:规定下拉列表中可见选项的数目。

###optgroup

  • label:定义选项组的描述
  • diabled:规定禁用该选项组
  <select>
    <optgroup label="Swedish Cars">
      <option value ="volvo">Volvo</option>
      <option value ="saab">Saab</option>
    </optgroup>

    <optgroup label="German Cars">
      <option value ="mercedes">Mercedes</option>
      <option value ="audi">Audi</option>
    </optgroup>
  </select>

效果如下:

</select>

##框架集frameset

  • cols:规定框架集中列的数目与尺寸,详见
  • rols:规定框架集中行的数目与尺寸,详见

注意不能让body标签与frame标签同时使用,而iframe必须配合body来使用,详见。若是浏览器不支持frameset,就必须为之定义noframeset标签,并且将noframeset的内容包含在body标签内。

<html>
	<frameset cols="25%,50%,25%">
		<frame src="/example/html/frame_a.html">
		<frame src="/example/html/frame_b.html">
		<frame src="/example/html/frame_c.html">
		<noframes>
		<body>您的浏览器无法处理框架!</body>
		</noframes>
	</frameset>
</html>

frameset的使用详见frameset

##iframe(内联框架)

iframe不属于frameset集合中,不被doctype的strict、transitional禁用。 对于有target属性来说的标签,如form、a的target=”framename”对frame、iframe都有效。

  • src width height name
  • frameborder:是否显示frame周围的边框,值为:0 1
  • scrolling:yes no auto ,规定是否在iframe中显示滚动条

##a超链接

  • target href hreflang
  • rel:规定当前文件与被链接文档之间的关系。
  • name:规定锚点的名称。

定义锚点的两种方式:

  1. id=”123”
  2. <a name="123"></a> 使用上为:<a href="#123"></a>

发送邮件:<a href="mailto:someone@test.com"></a>

##img

  • alt:规定当img无法加载时,替代img的文本内容。
  • src height width longdesc
  • ismap:将图片定义为服务端映射。
  <a href="test.html">
  	<img src="tulip.gif" ismap />
  </a>

当点击图片的时候,请求的链接是:test.html?157,94

  • usemap:将图片定义为客户端图片映射。值为:”#”+map的id或者name
    <img src="planets.jpg" border="0" usemap="#planetmap" alt="Planets" />
    <map name="planetmap" id="planetmap">
      <area shape="circle" coords="180,139,14" href ="venus.html" alt="Venus" />
      <area shape="circle" coords="129,161,10" href ="mercur.html" alt="Mercury" />
      <area shape="rect" coords="0,0,110,260" href ="sun.html" alt="Sun" />
    </map>

标签map有name与id属性,area只能用在map里面。

###area标签

  • alt 定义此区域内替换图片的内容
  • href:定义此区域的目标URL,nohref属性可以从图像映射中排出某个区域。
  • target:值为_blank _parent _self _top
  • shape:定义区域的形状,值为:default rect(x1,y1,x2,y2) circ(x,y,r) poly(x1,y1,x2,y2,x3,y3...),根据不同的shape需找coords的值得列表,坐标都是相对与左上角(0,0)的坐标。详见

##table

  • border:规定表格边框的宽度
  • frame:规定外侧边框的哪个部分是可见的。值为void(不显示) above(上部) below(下部) hsides(上下) lhs(左部) rhs(右部) vsides(左右) box(都显示) border(都显示)
  • rules:规定内侧边框的那个部分是可见的。最好使用css
  • summary:规定表格的摘要:对浏览器显示无影响
  • width
  • cellpadding:规定单元边沿与其内容之间的空白,使用css的td、th的padding替代。
  • cellspacing:规定单元格之间的空白。使用css的border-collapse(separate collapse inherit)替代

注意:在一些浏览器中,表格单元如歌没有内容,浏览器可能无法显示出的这个单元格的边框,这时可以放置一个 来替代。

###caption标签

定义元素表格标题:caption 标签必须紧随 table 标签之后。您只能对每个表格定义一个标题。通常这个标题会被居中于表格之上。

<table border="1">
  <caption>Monthly savings</caption>
  <tr>
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr>
    <td>January</td>
    <td>$100</td>
  </tr>
</table>

###thead、tbody、tfoot

thead定义表格的表头,tbody定于表格的主体内容个,tfoot定义表格的表注。他们呈现的顺序是thead、tbody、tfoot,如果想先呈现thead、tfoot,可以把这两个标签放置在tbody之前。当长的表格被打印时,表格的表头和页脚可被打印在包含表格数据的每张页面上。

###col与colgroup

为一列或几列定义属性

  • span:横跨的列数
  • align width valign

    Month Savings
    January $100
    February $80

###td与th、tr

td与th有rowspan、colspan属性可以横跨几行几列

##dl、dt与dd

<dl>
   <dt>计算机</dt>
   <dd>用来计算的仪器 ... ...</dd>
   <dt>显示器</dt>
   <dd>以视觉方式显示信息的装置 ... ...</dd>
</dl>
  • dl-自定义列表
  • dt-自定义项目
  • dd-自定义的描述

###字符缩写

详见

##head head标签中的base标签:为页面上的所有链接规定默认地址或默认目标。

<head>
	<base href="http://www.w3school.com.cn/i/" />
	<base target="_blank" />
</head>
<body>
	<img src="eg_smile.gif" />
	<a href="http://www.w3school.com.cn">W3School</a>
</body>
  1. 默认目标:当我们点击a的时候,会在新窗口打开。
  2. 默认地址,通常情况下,遇到相对URL时,浏览器会从当前文档的URL里提取相应的元素来填写相对URL的空白。但我们可以通过base标签来改变这一点,通过base的href属性,浏览器随后的相对URL不在使用当前文档的URL,而是使用base的href定义的URL,包括:a、img、link、form、area等标签中的相对URL(注意是相对)。

##html的多媒体标签

<embed><object><audio>(html5)<video>(html5)

作者:teazean 文章地址: