HTML5学习笔记一：新增主体结构元素
Dreamweaver快捷键： 属性面板：Ctrl+F3 新建文档：Ctrl+N 选择用网页查看：F12
新增的主体结构元素：
section元素（例子如下）：
<!DOCTYPE HTML>
<html>
<body>
<section>
<h2>section元素使用方法</h2>
<p> section元素用于对网站或应用程序中页面上的内容进行分块。</p>
</section>
</body>
</html>
article元素（例子如下）：
<!DOCTYPE HTML>
<html>
<body>
<article>
<header>
<h1> apple教程</h1>
<p>时间：<time pubdate="pubdate">2013-2-1</time></p>
</header>
<p>轻松学习apple教程，就来</p>
<a href="http://www.apple.com">www.apple.com</a><br />
<footer>
<p><small>底部版权信息：apple.com公司所有</small></p>
</footer>
</article>
</body>
</html>
article元素的嵌套（例子如下）：
<!DOCTYPE HTML>
<html>
<body>
<article>
<header>
<h1>article元素的嵌套</h1>
<p>发表日期：<time pubdate="pubdate">2012/10/10</time></p>
</header>
<p>article元素是什么？怎样使用article元素？……</p>
<section>
<h2>评论</h2>
<article>
<header>
<h3>发表者：唯一 </h3>
<p><time pubdate datetime="2011-12-23T:21-26:00">1小时前</time></p>
</header>
<p>这篇文章很不错啊，顶一下！</p>
</article>
<article>
<header>
<h3>发表者：唯一</h3>
<p><time pubdate datetime="2013-2-20 T:21-26:00">1小时前</time></p>
</header>
<p>这篇文章很不错啊</p>
</article>
</section>
</article>
</body>
</html>
aside元素（例子如下）：
<!DOCTYPE html>
<html>
<head>
<title>标题文件</title>
<link rel="stylesheet" href="mystyles.css"><!--rel 属性指示被链接的文档是一个样式表,rel属性规定当前文档与被链接文档之间的关系-->
</head>
<body>
<header>
<h1>站点主标题</h1>
</header>
<nav><!--<nav> 标签定义导航链接的部分-->
<ul>
<li>主页</li>
<li>图片</li>
<li>音频</li>
</ul>
</nav>
<section>
</section>
<aside>
<blockquote>文章1</blockquote>
<blockquote>文章2</blockquote>
</aside>
</body>
</html>
nav元素（例子如下）：
<!DOCTYPE html>
<html>
<body>
<h1>Time元素</h1>
<p id="p1">
<time datetime="2013-3-17"> 今天是2013年3月17日 </time>
</p>
<p id="p2">
<time datetime="2013-3-17T17:00"> 现在时间是2013年3月17日晚上5点 </time>
<p>
<p id="p3">
<time datetime="2013-12-31"> 新款冬装将于今年年底上市 </time>
</p>
<p id="p4">
<time datetime="2013-3-15" pubdate="true"> 本消息发布于2013年3月15日 </time>
</p>
</body>
</html>
郑重声明：本站内容如果来自互联网及其他传播媒体，其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。
