一些实例与应用
1、导航条
迄今为止,无序列表最常见的用途就是导航条,无论是水平的还是垂直的,自从基于表的布局已经过时,无序列表已经被当作导航元素的基础被广泛的应用,原因如下列表所示:
3、照片显示
HTML列表标签ul,li提供了有效的方式显示照片列表,原因与上面导航条提到的一样。下面就是一些以ul,li 标签为innerfade插件能让任意列表形式的内容依次淡入淡出切换显示,或是上下切换显示。内容可以是文字,图片等。支持各式标签,列表标签ul,li或是div,p标签都可以。
可以非常轻松的实现诸如新闻或公告内容的自动随机切换显示,或是图片幻灯片的播放显示等。
4、代码高亮
许多博客和教程网站含有JavaScript高亮代码的都是转换pre元素或textarea元素为有序列表,如下面的截图。其中有名的一款代码高亮插件是Alex Gorbatchev’s SyntaxHighlighter。
5、博客评论
博客评论,包括这些WordPress驱动的站点,以有序列表构建,提供非常灵活的样式选项,并奠定了评论嵌套的基础。下图截自腾讯CDC T.d 昨天发布的The Story of Mr.Gray — Web 交互设计“灰色”的8类应用一文评论部分。
6、商品列表
最典型的代表莫过于淘宝网首页的“宝贝类目”一栏的万千商品类目的显示:
制作全套视频下载地址: