Blog > 用户体验设计 > 再谈如何表现已点击的链接

再谈如何表现已点击的链接

上次发表《如何表现已点击的链接》一文,很多朋友和5key讨论了这个已点击的链接是否需要去修饰,怎样去修饰。这两天花时间看了很多国内外的文章。在这里总结如下四种方式:

预览地址:http://5key.net/demo/link-visited2/
已点击的链接

1、Line-Through属性。
这是最简单的表现已点击链接的一种方式。在:visited中加上line-through。

2、点击后显示隐藏的span
在a标签中加入一对span,默认将其隐藏,链接被点击后显示span中的内容

3、:after伪类
a:visited:after { content: ” (已点击)”; },可惜IE不支持:after。

4、visited的背景图片
上次《如何表现已点击的链接》有详细的介绍,这里就不重复了。


如何表现已点击的链接

已点击过的链接

已点击过的链接


已点击过的链接 IE不支持

4条评论

  1. DeadFire says:

    好像opera浏览器全不支持这些。我看的没效果的样子。

  2. skyheming says:

    用Line-Through,个人觉得不太符合语意。不推荐这样用

  3. Pingback: 5key’s blog » 2007年5key.net最受欢迎的十大文章

  4. Yellow says:

    喜欢第二种和第三种给人的感觉简单明了

发表评论

电子邮件地址不会被公开。 必填项已用 * 标注

*

您可以使用这些 HTML 标签和属性: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>