html5css3专题培训课件

role=”complementary” (补充性内容）
role=”contentinfo” (内容信息）
与aside元素对应关系。应将其添 加到aside或div（前提是该div中仅 包含补充性内容）中。可以在一个 页面多包含几个complementary,不 要过度使用
将其添加至整个页面的页脚，每个 页面仅使用一次。
•section用在文章里的可以这样理解，article 包含整个文章，section则包含一篇文章的一 个小节，若干个段落组成一个section。
附注栏：aside
•有时候，页面中有一部分内容与主题内容 相关性不强但可以独立存在，就可以使用 aside标签。
•使用aside的例子还包括重要引述、侧栏， 指向相关文章的一组链接等等。
地标பைடு நூலகம்色
如何使用及何时使用
role=”banner” (横幅）
role=”navigation” (导航）
role=”main” (主体）
将其添加到页面级的header元素，每个页面只用一次
与nav元素是对应关系。应将其添加到每一个nav元素，或其 他包含导航性链接的容器。 与main元素对应关系。最好将其添加到main元素，也可以添 加到其他表示主体内容的元素（可能是div),只能用一次
文章：article
•article元素表示文档、 页面、应用或网站中一个 独立的容器，原则上是可 独立分配或可再用的，就 像聚合内容中的各部分。 它可以是一篇论坛帖子、 一篇杂志或报纸文章、一 篇博客条目、一则用户提 交的评论、一个交互式的
定义块区：section
•section元素代表文档或应用的一个一般的 区块。在这里section是具有相似主题的一组 内容，通常包含一个标题。
标题：hn
•html提供了六级标题用于创 建页面信息的层级关系。使 用h1、h2、h3、h4、h5和 h6元素对各级标题进行标记 ，其中h1最高,后面依次递减 。
•如果页面中有一块包 含一组介绍性或导航 性内容的区域，应该 用header元素进行标 记。一个页面可以有 任意数量的header元 素，它们根据其含义 不同位置也不同，处 于页面顶端或者接近
创建页脚：footer
•footer元素代表嵌套它的 最近的article、aside、 blockquote、body、 details、fieldset、figure、 nav、section或td元素的页 脚。只有当它最近的祖先 是body时，它才是整个页 面的页脚。
•如果一个footer包着它所
页眉
标记导航：nav
•nav中的链接可以指向页面中的内 容，也可以指向其他页面或资源 ，或者两者兼而有之。无论哪种 情况，应该仅对文档中重要的链 接群使用nav。 •用法：<nav>一组链接</nav>
标记页面主要区域：main
•一个页面仅有一个部分代表其主 要内容。可以将这样的内容包在 main元素中，该元素在一个页面 中仅使用一次。 •不能将main放置在article、aside 、footer、header或nav元素中
元素的title属性
•可以使用title属性（ 与title元素不同）为 网站上任何部分加上 提示标签。而且它们 并不只是提示标签， 加上它们之后屏幕阅 读器可以为用户朗读 title文本，因此使用 title可以提升无障碍
作业：
用Dreamweaver制作一个简单的网页。
要求：根据语义在合适地方用上今天所学到的标签， 包括：div、title、hn(可选任意数量)、header、 footer、nav、main、article、section、aside、role 、li.
通用容器：div
•有时需要在一段内容外围包一个容器，从而 可以为其应用css样式或者javascript效果。如 果没有这个容器，页面就会不一样。div是一 个完全没有任何语义含义的容器。
地标角色：role
•WAI-ARIA(Web Accessibility Initiative's Accessible Rich Internet Applications,无障碍网页协议-无障碍富互联网应用，简称ARIA)是一 种技术规范，在html提供相应的语义功能之前，它会使用属性来填补 一些语义上的空白。