HTML、CSS和JavaScript学习五(案例分析二表格、项目列表和超链接)


二.表格、列表和链接的结合使用,实现的功能是将数据进行表格的格式化,在表格的每一项中有一个链接,点击链接有两种效果:1.可以打开所有的列表项2.只能打开一个列表项。先看效果图

	
	
	无标题文档
	
	
	
	
	
	
	
好友菜单列表
大家看到
大家看到
大家看到
大家看到
大家看到
好友菜单列表
大家看到
大家看到
大家看到
大家看到
大家看到
好友菜单列表
大家看到
大家看到
大家看到
大家看到
大家看到
好友菜单列表
大家看到
大家看到
大家看到
大家看到
大家看到
好友菜单列表
大家看到
大家看到
大家看到
大家看到
大家看到

html代码(定义界面)

整个界面是以表格的形式展现,

标签定义在标签中;
标签中有5行,用标签表示;每行中有一个单元格,用
表示;每个单元格中有一个超链接,用表示,和一个
标签。

标签中的href="javascript:void(0)"表示点击这个超链接没有效果,也就是不会打开新的页面,等同于href="#";另外给这个超链接注册一个事件(也就是javascript代码)。

css代码(定义样式)

分别有标签选择器(table)、多重选择器(table tdtable td div)、复合选择器(table td a:link,table td a:visited)和类选择器(.open.close)

Javascript代码(动态交互)

有两个

你可能感兴趣的:(java学习)