web前端开发技术实验报告 实验四.docVIP

长 春 大 学 20 15 — 2016学年第 二 学期 Web前端开发技术 课程 实 验 报 告 学 院： 计算机科学技术 专 业： 软件工程 班 级： 软件14402 学 号： 041440204 姓 名： 梁媛 任课教师： 车娜 实验四 列表与超链接 一、实验目的 1.掌握无序、有序及定义列表的使用，可以制作常见的网页列表模块； 2.掌握超链接标记的使用，能够使用超链接定义网页元素； 3.掌握CSS伪类，会使用CSS伪类实现超链接特效； 二、内容及要求 运用列表标记、超链接标记以及CSS控制列表与超链接的样式实现网页中常见的新闻列表，其效果如图4-1所示，满足如下要求： 1.整个新闻列表整体上由上面的新闻标题和下面的新闻内容两部分构成。 2.新闻内容部分结构清晰，各条新闻并列存在、不分先后。 3.其中各条新闻都是可以点击的链接，当鼠标移上时，其样式会发生变化，如图4-2所示。 4.每个列表项目前添加列表项目图像。 图4-1 新闻列表效果展示 图4-2 鼠标移上链接文字效果 三、实验原理 无序列表：网页中最常用的列表，之所以称为“无序列表”，是因为其