网页上定义超链接的外观

十月 27, 2013

网页上可以使用 CSS 伪类来自定义超链接(<a>元素)的外观,一般定义三种外观:未访问(a:link),鼠标悬停(a:hover),已访问(a:visited)。但是改完之后,总感觉在 IE 浏览器中是怪怪的。后来查阅了一下资料之后发现,果然有问题。最终修改如下:

a:link {
   text-decoration: none;
}

a:visited {
   text-decoration: none;
}

a:hover {   /* note: a:hover must be placed after a:link and a:visited, 
              or it would work wrong in old Internet Explorer !!! */
   text-decoration: underline;
}

问题已然明了,总结起来就是:a:hover 必须放在 a:link 与 a:visited 之后,否则在老版本的 IE 中显示就会有问题。

实验室的网页现在又被我去掉了 redirect 页面,老的 IE 6 浏览器也可以访问了(测试了一下之后发现只有首页页面的其中一个框比较难看一点,其他都正常)。另外还加了这么一条标签:


<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />

据说这样子如果遇到 IE 浏览器,可以强制使用最新的 IE 版本的渲染模式,这样就不怕那些“国产双核浏览器”乱用老的 IE 的渲染了。至于效果如何,还有待验证。

posted in Website Design by billzt

Follow comments via the RSS Feed | Leave a comment | Trackback URL

说点什么

您将是第一位评论人!

提醒
wpDiscuz
 

Copyright © 2010-2017 | Powered by Wordpress and MySQL. Theme by Shlomi Noach, openark.org