标签:
1.各种表签的含义与写法:
注释:<!-- .. -->
声明版本为5:<!DOCTYPE html>
字体设置:<meta charset="utf-8" />
属性: 所有元素的全局属性; 只适用于某个元素的专用属性; 事件处理器的内容属性;
<div> 用于划分区域,但不能表示区域的含义;倾向于格式化划分文档;
<section> 表示文档任意的逻辑分区;属于全局属性
<article> 内容相对于其他内容独立,可独立开发;
<aside> 用于在侧边栏创建旁注;
<aside style="font-size:larger;font-style:italic;color:blue;float:right;width:120px;"> ... </aside> <!--将文本的内容呈现在右侧-->
<header> 创建文头; 中间的文字为文头(并不是<title>),可以使用<span>对文字进行渲染;不可以在<footer>.<address>和其他<header>元素内使用<header>元素;
<hgroup> 结构化元素;添加标题和副标题结合起来;<h1>
<footer> 任何区域创建文脚,文脚可以包含版本信息,作者信息,引用,隐私策略; 注:版权符号 "©"
<nav> 创建一个容器,表明某个区域用于导航; 其中插入<a herf = "链接的地址"></a> | <!-- ‘|‘ 就是分界的符号 -->
<figure> 插入图表
<figure>
<img src = "file:///H|/书籍代码/Beginning HTML and CSS/code/c04/images/apple.jpg" width="170" height="128" />
<figcaption> One of out many chesssecakes </figcaption> <!-- 放在图片下面后右边-->
</figure>
www.caniuse.com 可查看各浏览器对HTML5的兼容性;
www.modernizr.com 使用最多的HTML5及CSS资源站点之一;提供可供下载的功能强大的JS库;
<hr> 添加实水平线;可以代替<p>来分割区域;
<iframe> 打开两个独立的站点;其中可以使用 seamless属性来下消除任何边框或者滚动条;但是目前浏览器并不支持;
<iframe src="http://www.friendsofed.com/"width="600" height="250" seamless></iframe><br>
<embed> 可以在Web页面中插入多种类型的媒体文件;
<area> 利用图像映射创建超链接;**
2. HTML5结构化语义元素: -> 使用微数据,图像容器和aside元素创建网页的语义结构;(搜索引擎容易搜索到健全语义结构的Web页面)
微数据是以结构化的方式为HTML内容进行标记的三种方法之一(其他两种分别是微格式和RDF).
使用微数据语法擦创建元素,本质上就是为标准的HTML标签声明三个属性:
itemscope 布尔型属性,用于创建一个条目;
itemprop 用于给条目或其子条目增加一个属性;
itemtype 定义自定义词汇表;
<div itemscope itemtype="http://www...">
<p>Name:<span itemprop="name">Marco</span></p>
itemtype : 属性值可以通过URL指定;
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"> 没加微元素<!-- <meta charset="utf-8" /> -->
标签:
原文地址:http://www.cnblogs.com/hxer/p/5393445.html