</head> <article> h1>课程介绍</h1> <section> h3>操作系统<h3> N5。p>操作系统是高等教育自学考试计算机专业的一门必修的专业基 础课程。</p on> <h3>编译原理</h3> <p>编译原理是计算机专业的一门重要专业课,旨在介绍编译程序构 造的一般原理和基本方法。内容包括语言和文法…管理、代码优化和目标代码 生成。<p> </section> article> 2.3 nav 元素介绍: nav元素是一个可以用作页面导航的链接组,其中的导航元素链 接到其他页面或当前页面的其他部分。 主要用途: 传统导航条、侧边导航条、页内导航、翻页操作 元素说明: (1)<nav>元素是HTML5的新元素,它支持HTML5的全局属 性和事件属性。 (2)不需要将所有的链接都放到<nav>元素中,只需要把主要的、 基本的链接组放到nav元素。 (3)尽量不要使用<menu>元素代替<nav>。 案例 示例6-4:网站导航链接 <doctype html> <html> <head> 6《网页设计与网站规划》讲稿/河南中医学院互联网应用技术研究所/ht/ bs. 51xueweb cn
6 《网页设计与网站规划》讲稿 / 河南中医学院互联网应用技术研究所 / http://labs.51xueweb.cn </head> <body> <article> <h1>课程介绍</h1> <section> <h3>操作系统</h3> <p>操作系统是高等教育自学考试计算机专业的一门必修的专业基 础课程。</p> </section> <section> <h3>编译原理</h3> <p>编译原理是计算机专业的一门重要专业课，旨在介绍编译程序构 造的一般原理和基本方法。内容包括语言和文法...管理、代码优化和目标代码 生成。 </p> </section> </article> </body> </html> 2.3 nav 元素介绍： nav 元素是一个可以用作页面导航的链接组，其中的导航元素链 接到其他页面或当前页面的其他部分。 主要用途： 传统导航条、侧边导航条、页内导航、翻页操作 元素说明： （1）<nav>元素是 HTML 5 的新元素，它支持 HTML 5 的全局属 性和事件属性。 （2）不需要将所有的链接都放到<nav>元素中，只需要把主要的、 基本的链接组放到 nav 元素。 （3）尽量不要使用<menu>元素代替<nav>。 案例： 示例 6-4：网站导航链接 <!doctype html> <html> <head>
<meta charset="utf-8> tte>nav元素<itle </head> <h1>课程资源发布<h1> <u> |>< a href=" index htn">首页</a></li> li>< a href=" Web Develop. htm">Web前端开发</a>< <>< a href=" Linux htm"> Linux操作系统</a></i> li> <a href=" MySQL.htm"> My SQL数据库管理<a><l> <l|>< a href=" Network. htm">计算机网络</a></li> </u </nay> 2. 4 aside 元素介绍 aside元素用来表示当前页面或文章的附属信息部分。它可以包 含与当前页面或主要内容相关的引用、侧边栏、广告、导航条,以及 其他类似的有别于主要内容的部分。 在使用上, aside有两种主要的使用方法 (1)被包含在 article元素中作为主要内容的附属信息部分, 其中的内容可以是与当前文章有关的参考资料、名词解释等。 (2)在 article元素之外使用,作为页面或者站点全局的附属 信息部分。其中的内容可以是侧边栏、友情链接、相关内容、广告等 主要用途 引用、侧边栏、广告、次级导航条、备注 元素说明 (1)< aside>元素是HTML5的新元素,且支持HTML5的全局 属性和事件属性。 案例 示例6-5:文章附属信息 7《网页设计与网站规划》讲稿/河南中医学院互联网应用技术研究所/ht/ os. 51xueweb cn
7 《网页设计与网站规划》讲稿 / 河南中医学院互联网应用技术研究所 / http://labs.51xueweb.cn <meta charset="utf-8"> <title>nav 元素</title> </head> <body> <h1>课程资源发布</h1> <nav> <ul> <li><a href="index.html">首页</a></li> <li><a href="WebDevelop.html">Web 前端开发</a></li> <li><a href="Linux.html">Linux 操作系统</a></li> <li><a href="MySQL.html">MySQL 数据库管理</a></li> <li><a href="Network.html">计算机网络</a></li> </ul> </nav> </body> </html> 2.4 aside 元素介绍： aside 元素用来表示当前页面或文章的附属信息部分。它可以包 含与当前页面或主要内容相关的引用、侧边栏、广告、导航条，以及 其他类似的有别于主要内容的部分。 在使用上，aside 有两种主要的使用方法： （1）被包含在 article 元素中作为主要内容的附属信息部分， 其中的内容可以是与当前文章有关的参考资料、名词解释等。 （2）在 article 元素之外使用，作为页面或者站点全局的附属 信息部分。其中的内容可以是侧边栏、友情链接、相关内容、广告等。 主要用途： 引用、侧边栏、广告、次级导航条、备注 元素说明： （1）<aside>元素是 HTML 5 的新元素，且支持 HTML 5 的全局 属性和事件属性。 案例： 示例 6-5：文章附属信息
Doctype html> <html> <meta charset="utf-8> tte>文章附属信息 aside元素</itle </head> h1>关于原型设计的一些事</h1> <p>文章来源:ht:/www.ikent.me/blog/4477~</p> </header <article> <h2>关于什么是原型</2> p>为了讨论方便,有必要先做一个简单的定义。<p> p>这里的原型指的是对最终产品各页面上内容的简单呈现,通常不会设置 颜色和字体,也不含图片。这里的原型,也通常被称作线框图、示意图、蓝图。 <h2>关于原型的精细程度</2> p>业界普遍的认知是,原型做相对中保真即可。中保真的原则是,对照原 型,团队的设计师和工程师能够明白我们要做的是一件什么事情及这件事“p> <aside> <h3>参考资料<h3> p>基于Aure的PRD写作思考<p> <p>基于 axure的PRD协作<p </aside> </article> 示例6-6:页面附属信息 <!doctype html> <html> <head <meta charset="utf-8> tte>asde作为侧边栏</tte <h1>我省教育投入10年涨5倍,夯实基础广育人才</h1> <h3>发布时间:2012-10-1611:24:28</h3> <h3>作者:赵媛高冬丽 来源:河南日报<h3> 8《网页设计与网站规划》讲稿/河南中医学院互联网应用技术研究所/htp/ bs. 51xueweb cn
8 《网页设计与网站规划》讲稿 / 河南中医学院互联网应用技术研究所 / http://labs.51xueweb.cn <!doctype html> <html> <head> <meta charset="utf-8"> <title>文章附属信息 aside 元素</title> </head> <body> <header> <h1>关于原型设计的一些事</h1> <p>文章来源：http://www.ikent.me/blog/4477</p> </header> <article> <h2>关于什么是原型</h2> <p>为了讨论方便，有必要先做一个简单的定义。</p> <p>这里的原型指的是对最终产品各页面上内容的简单呈现，通常不会设置 颜色和字体，也不含图片。这里的原型，也通常被称作线框图、示意图、蓝图。 </p> <h2>关于原型的精细程度</h2> <p>业界普遍的认知是，原型做相对中保真即可。中保真的原则是，对照原 型，团队的设计师和工程师能够明白我们要做的是一件什么事情及这件事</p> <aside> <h3>参考资料</h3> <p>基于 Axure 的 PRD 写作思考</p> <p>基于 axure 的 PRD 协作</p> </aside> </article> </body> </html> 示例 6-6：页面附属信息 <!doctype html> <html> <head> <meta charset="utf-8"> <title>aside 作为侧边栏</title> </head> <body> <header> <h1>我省教育投入 10 年涨 5 倍，夯实基础广育人才</h1> <h3>发布时间：2012-10-16 11:24:28</h3> <h3>作者：赵媛 高冬丽 来源：河南日报</h3> </header>
p>十年前,如果一个娃娃呱呱坠地,此时已经上了小学。<> p>教育关系到每一个孩子的前途命运,寄托着亿万家庭对生活的期许,承 载着民族的未来。<p> p>十年来,我省教育取得了跨越式发展。义务教育实现了真正意义的免费 教育,“农村娃”和城里孩子一样走进公办学校享受“同城待遇”。职业教…p> </article> <aside> h1>今日推荐<h1> <>幼儿园教职工配备有了国家标准</> <>中小学、幼儿园开评正高级教师</> <l|>我省财政优先保证教育投入</> <>我省200名中小学幼儿园教师接.</> </u> 2.5 time 元素介绍: time元素代表24小时中的每个时刻或者某个日期,它表示时间 时允许带时差。 time元素是一个微格式。微格式是利用HTML的 class属性来对 网页添加附加信息的方法。微格式一直存在,只不过在使用上出现了 些问题,因此HTML5才增加了time元素来明确的对时间进行机器 编码,进而增加信息的可读性。 主要用途: 对时间进行格式定义。 元素说明: (1)<time>元素是HTML5的新元素,且支持HTM5的全局属 性和时间属性。 (2)<time>元素定义公历的时间(24小时制)或日期,时间和 时区偏移是可选的。 (3)目前该元素支持的浏览器不是很多,需要慎重使用 (4)<time>元素的开始标记和结束标记之间的内容将显示在页 9《网页设计与网站规划》讲稿/河南中医学院互联网应用技术研究所/htp/ bs. 51xueweb cn
9 《网页设计与网站规划》讲稿 / 河南中医学院互联网应用技术研究所 / http://labs.51xueweb.cn <article> <p>十年前，如果一个娃娃呱呱坠地，此时已经上了小学。</p> <p>教育关系到每一个孩子的前途命运，寄托着亿万家庭对生活的期许，承 载着民族的未来。</p> <p>十年来，我省教育取得了跨越式发展。义务教育实现了真正意义的免费 教育，“农村娃”和城里孩子一样走进公办学校享受“同城待遇”。职业教...</p> </article> <aside> <h1>今日推荐</h1> <ul> <li>幼儿园教职工配备有了国家标准</li> <li>中小学、幼儿园开评正高级教师</li> <li>我省财政优先保证教育投入</li> <li>我省 200 名中小学幼儿园教师接...</li> </ul> </aside> </body> </html> 2.5 time 元素介绍： time 元素代表 24 小时中的每个时刻或者某个日期，它表示时间 时允许带时差。 time 元素是一个微格式。微格式是利用 HTML 的 class 属性来对 网页添加附加信息的方法。微格式一直存在，只不过在使用上出现了 一些问题，因此 HTML 5 才增加了 time 元素来明确的对时间进行机器 编码，进而增加信息的可读性。 主要用途： 对时间进行格式定义。 元素说明： （1）<time>元素是 HTML 5 的新元素，且支持 HTML 5 的全局属 性和时间属性。 （2）<time>元素定义公历的时间（24 小时制）或日期，时间和 时区偏移是可选的。 （3）目前该元素支持的浏览器不是很多，需要慎重使用。 （4）<time>元素的开始标记和结束标记之间的内容将显示在页