《使用HTML5实现响应式布局》第二章-页面结构-实践学习资料_第1页
《使用HTML5实现响应式布局》第二章-页面结构-实践学习资料_第2页
《使用HTML5实现响应式布局》第二章-页面结构-实践学习资料_第3页
《使用HTML5实现响应式布局》第二章-页面结构-实践学习资料_第4页
《使用HTML5实现响应式布局》第二章-页面结构-实践学习资料_第5页
已阅读5页,还剩8页未读 继续免费阅读

下载本文档

版权说明:本文档由用户提供并上传,收益归属内容提供方,若内容存在侵权,请进行举报或认领

文档简介

第二章页面结构实践目标搭建体育新闻列表网页制作博客内容网页任务一:搭建体育新闻列表网页使用HTML5搭建体育新闻列表网页的文档结构。体育新闻列表网页是以列表形式呈现最新的体育新闻要求页面顶部包含导航链接、新闻标题、新闻内容预览、推荐浏览和页脚导航,使用HTML5的主体和非主体结构标签、文本标签、超链接标签来组织页面结构。页面结构要清晰合理,标签的使用正确得当。创建HTML5页面,修改页面标题。创建页面的顶部菜单。创建页面中部的新闻标题。创建页面的页脚部分。搭建体育新闻列表网页搭建体育新闻列表网页<header><nav><!--省略--></nav></header><section><article><header><!--省略--></header><footer><!--省略--></footer></article><article><!--省略--></article></section><section><!--省略--></section><footer><!--省略--></footer>

网页导航链接新闻1新闻2推荐页脚搭建体育新闻列表网页使用HTML5的文档结构标签、文本标签、超链接标签,搭建网页的文档结构任务二:制作博客内容网页使用HTML5的主体结构标签制作博客的内容网页。博客内容网页主要展示博客的正文明细,整个页面包括博客页的顶部标题区、导航链接、侧边栏、博客正文区、评论区。使用HTML5的主体和非主体结构标签、文本标签和超链接标签组织页面结构。页面结构要清晰合理,标签的使用正确得当制作博客内容网页使用header标签创建页面顶部区域,包含标题内容。使用nav标签创建顶部区域的导航链接使用article标签创建页面中部博客正文使用aside标签创建页面的侧边栏。使用div标签创建评论区域内容页面的顶部区域制作博客内容网页<header><hgroup><!--省略--></hgroup></header><nav><!--省略--></nav>header、hgroup标签创建网页正副标题nav标签创建页面链接正文区域制作博客内容网页<article>

<header><!--省略--></header>

<section>

<article>

<header><!--省略-->

</article>

<article>

<header><!--省略--></header></article>

</section>

<footer><!--省略--></footer></article>header标签创建文章列表标题article标签创建文章1article标签创建文章2foot标签创建页脚<aside><!--省略--></aside><footer><!--省略--></footer>侧边区域和页脚制作博客内容网页aside标签创建

温馨提示

  • 1. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等,如果需要附件,请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸,网页内容里面会有图纸预览,若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对用户上传分享的文档内容本身不做任何修改或编辑,并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容,请与我们联系,我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

评论

0/150

提交评论