html5个人笔记byLying

H5笔记

---

点击查询网页是否符合H5规范

---

一、小知识点

1、链接外部css样式

<link rel="stylesheet" href="css/text.css" type="text/css">

• rel(relationship)：用于定义链接的文件和HEML文档之间的关系

• href：链接文件，填写文件的相对路径

• type：text指对象为网页中的文本css或javaScript是指当前指定的文本类型

2、自动刷新页面

<meta http-equiv="refresh" content="1">

• http-equiv 的refresh属性表示刷新

• content 属性表示刷新间隔是多少秒

3、列表

• <li>：定义列表项目。

  • 可指定id、style、class等属性。

  • 还可以指定onclick等事件属性。

  • 可以包含与<div.../>完全类似的内容，可以包含较多类型的子元素。

• <dl>：定义列表。

  • 可指定id、style、class等属性。

  • 还可以指定onclick等事件属性。

  • 只能包含<dt.../> <dd.../> 两种子元素。

• <dt>：定义标题列表项。

  • 可指定id、style、class等属性。

  • 还可以指定onclick等事件属性。

  • 只能包含文本、图像、超链接、文本格式化元素和表单控件元素等。

• <dd>：定义普通列表项。

  • 可指定id、style、class等属性。

  • 还可以指定onclick等事件属性。

  • 可以包含与<div.../>完全类似的内容，可以包含较多类型的子元素。

<ul>
  <li>Coffee</li>
</ul>

• 无序列表

• <ul>：定义无序列表。

  • 可指定id、style、class等属性。

  • 还可以指定onclick等事件属性。

  • 只能包含<li.../>子元素。

<ol>
 <li>Milk</li>
</ol>

• 有序列表

• <ol>：定义有序列表。

  • 可指定id、style、class等属性。

  • 还可以指定onclick等事件属性。

  • 只能包含<li.../>子元素。

  • 可指定三个属性：

  • start：指定列表项的起始数字。默认是第一个 如 1、A。

  • type：指定使用哪种类型的编号。例如一代表用数字。A和a代表使用字母，I和i代表使用罗马数字。(推荐使用CSS来定义)

4、元素可以省略结束标签

• 可以省略结束标签的元素（空元素）：area、base、br、col、command、embed、hr、img、input、keygen、link、mata、param、sourse、wbr。

例如img格式：<img src="a.png" /> 或 <img src="a.png">

• 可以省略结束标签的元素：colgroup、dt、dd、li、optgroup、option、p、rt、rp、thead、tbody、tfoot、tr、td、th。

• 可以省略全部标签的元素：html、head、body、tbody。

5、元素span..div..p的不同

• span 不会导致换行

• div 会导致换行

• p 会导致分段落

• span和p 只能包含文本、图像、超链接、文本格式化元素和表单控制元素等内容。

• p可以包含span，但span不能包含p。

• div 可以包含很多很多的元素（范围最广）。

5、文本格式化元素

均可指定id、class、style。及onclick等各种事件属性。

• <b> ：定义粗体文本。

• <i> ：定义斜体文本。

• <em>：定义强调文本，类似斜体文本。

• <strong>：定义粗体文本。

• <small>：定义小号字体文本。用于标识“小字印刷体”，标注诸如免责声明、注意事项、法律规定和版权相关的声明性文字。

• <sup>：定义上标文本。

• <sub>：定义下标文本。

• <bdo>：定义文本显示的方向。可以指定dir属性，该属性值只能是ltr或rtl。

6、语义相关元素

• <abbr>：表示一个缩写。

  • 鼠标放置时出现提示标签显示title文字

例子：<abbr title="傻逼逼">sb</abbr>

• <address>：表示一个地址。默认显示斜体字。

• <blockquote>：定义一段长的引用文本。默认使用缩进格式显示。

• 可指定属性cite：该属性指定该引用文本所引用的网址URL。

• <q> 定义一段短的引用文本。默认自动添加引号。

• <cite> 表示作品的标题。默认斜体字显示。

• <code> 表示一段计算机代码。

• <dfn> 定义一个专业术语。默认粗体或斜体显示。

• <del> 定义被删除的文本。默认中划线显示。

• <ins> 定义插入的文本。默认下划线显示。

  • cite：属性值为一个URL，该URL对应的文本解释了文本被删除或插入的原因。

  • datetime：定义文本被删除或插入的日期、时间。

• <pre> 表示该元素所包含的文本已经进行了“预格式化”，即它所包含文本中的空格、回车、Tab键和其他格式字符都会被保留下来，但浏览器会处理元素内大部分HTML元素。

• <samp> 定义示范文本内容。

• <kbd> 定义键盘文本。表示文本是通过键盘输入的。通常在计算机使用文档、使用说明中会经常使用该元素。

6、超链接和锚点

• href：指定超链接所关联的另一个资源。

• target：指定使用的框架集中的哪个框架来装载另一个资源。该属性的属性值可以是 _self、_blank、_top、_parent 四个值，分别代表使用自身、新窗口、顶层框架、父框架来装载新资源。

• media：指定目标URL所引用的媒体类型，默认为all。只有指定了href属性时它才有效。

7、图像相关元素

• src：指定图片文件所在的位置，既可以是相对路径，也可以是绝对路径。

• alt：指定一段文本。作为图片的提示信息。

• height：图片的高度。可以是百分比也可以是像素值。

• weight：图片的宽度。可以是百分比也可以是像素值。

• <map>：定义图片映射。主要可以包含一个或多个 <area.../> 子元素。每个 <area.../> 定义一个区域，不同区域可链接到不同URL。

• <area>：定义图片映射的内部区域。

  • 该元素只能是一个空元素。

  • 可指定id、style、class等属性。

  • 还可以指定onclick等事件属性。

  • 还可以指定以下几个属性：

  • shape ：指定该内部区域是哪种区域。默认值时候“rect”，即矩形区域；除此之外还可以是 circle 和 ploy。