制作“习近平总书记考察清华大学并发表重要讲话”新闻页面,页面包括页头、正文、页脚三个部分。页面各部分包括如下内容:
①页头:包括“登录/注册”导航、新闻标题和水平线。
②正文:包括新闻图片和文字。
③页脚:包括新闻来源信息。
最终页面效果如图2-2所示。
图2-2 页面效果
新闻页面一共包括三个部分,其中页头又分为两个部分,正文分为两个部分,页面结构如图2-3所示。
图2-3 页面结构
①新建项目“chapter01”。
②在项目“chapter01”内创建新闻页面,并将它命名为“lesson1-after”,如图2-4所示。
图2-4 创建新文件
③修改标题为“‘习近平总书记考察清华大学并发表重要讲话’新闻页面”,并使用header、main和footer标签设置页面布局。
①在header标签内添加“登录/注册”导航链接。
②在header标签内添加新闻标题及水平线。
③在main标签内添加新闻图片。
④在main标签内添加新闻文字内容。
⑤在footer标签内添加新闻编辑信息并设置contenteditable的属性值为“true”。
⑥页面中相关CSS样式的设置会在后续课程中进行讲解,在此不再赘述。任务完整代码见二维码2-1。