飘零雾雨的专栏

欢迎到我的主博客:css探索之旅(http://blog.doyoe.com/)

规范化的链接样式顺序?

  有的时候文章的相关链接太多了,一时半会不好分辨哪些文章是自己已看过的,哪些又是还没有来得及研读的等等,虽说是个小小的问题,但也得耗费你的一点时间:)

  既然只是个小小的问题,解决的方法当然也是极为简单的,所要求的只是一个好记性和熟练程度或者好习惯。 

  举一例子来说先:

  [演示地址:http://www.doyoe.com/model/xhtmlcss/style/link.htm

CSS部分:

a:link {
 color:#000;
}
a:visited {
 color:#050;
}
a:focus {
 color: #f00;
}
a:hover {
 color:#f00;
}
a:active {
 color:#630;
}

XHTML部分:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<meta name="Author" content="Doyoe, 飘零雾雨, edzmaster@gmail.com" />
<title>test</title>
</head>
<body>
<h3>亲和力较好的链接样式顺序:</h3>
<ul>
 <li><a href="1.htm">测试</a></li>
 <li><a href="2.htm">测试</a></li>
 <li><a href="3.htm">测试</a></li>
 <li><a href="4.htm">测试</a></li>
 <li><a href="5.htm">测试</a></li>
 <li><a href="6.htm">测试</a></li>
</ul>
</body>
</html>

  从上面这个简单的例子中就可以比较方便的区别出读与未读的关系。链接的四种状态分别为:a:link, a:visited, a:hover和a : active。意思是:链接,已访问过的链接,鼠标经过链接时,鼠标点击链接时。缩写起来的顺序就是LVHA(分别取其首字母),有人为了方便记忆,把这几个字母溶入了两个单词:love hate(喜欢和讨厌)。为第一个提出这种方便记忆方法的哥们赞一个:)

  有人会说上面还有一个a:focus呢,这个又是用来做什么的?

  这个其实也是一种链接状态,就是当你在键盘上按Tab键时获得焦点的那个链接的即时状态,遗憾的是ie并不支持(ie中按Tab键显示的效果为a:active时的状态),只有在FF,Opera等浏览器下才能看到效果。

 
阅读更多
个人分类: CSS
想对作者说点什么? 我来说一句

JAVA编程规范化

2014年04月18日 388KB 下载

没有更多推荐了,返回首页

加入CSDN,享受更精准的内容推荐,与500万程序员共同成长!
关闭
关闭