0

我创建了一个简单的网页,三个链接在悬停时字体增加了 110%,这些链接也应该在鼠标悬停时改变颜色。

在 IE 中,除了“联系我们”链接之外,这些链接都按预期运行,而在 Firefox 中则相反,只有第一个链接不会改变颜色。

@font-face {
    font-family: 'ChollUni';
    src: url('fonts/ChollUni.eot?#iefix') format('embedded-opentype'), 
         url('fonts/ChollUni.woff') format('woff'), 
         url('fonts/ChollUni.ttf')  format('truetype'),
         url('fonts/ChollUni.svg#ChollUni') format('svg');
         }
#logo {
    padding: 100px 100px 100px 100px;
    }
#links {
    text-align:center;
    text-decoration:none;
    margin: 10px auto;
    color:#4F91CD;
    font-family: 'ChollUni',Helvetica, san-serif;
    font-size:22px;
    }
#links a:link {
    text-decoration:none;
    color:#4F91CD;
    }
#links a:hover {
    color:#244d71;
    text-decoration:underline;
    font-size:110%
    }
#links a:visited {
    text-decoration:none;
    color:#4F91CD;
    }
#footer {
    text-align: center;
    padding: 35px 90px 35px 90px;
    color: #999;
    font-family: 'ChollUni',Helvetica, san-serif;
    position: absolute;
    left: 7px;
    top: 424px;
    }   

HTML

<!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=UTF-8" />
<link rel="stylesheet" href="fonts.css" type="text/css" charset="utf-8" />
<title>Some Company Website</title>
</head>
<body>
<div id="logo">
<center><img src="Images/logo.png"></center>
</div>
<div id="links">
<a href="http://www.SomeCompany.ca/mewebmail">Customer Email</a>&nbsp;&nbsp;
<a href="http://www.SomeCompany.ca/meadmin">Webmail Administration</a>
&nbsp;&nbsp;
<a href="contact.html">Contact Us</a>
</div>
<br />
<br />
<div id="footer">
 Copyright 2013 Some Company &copy; All Rights Reserved
</div>
</body>
</html>
4

0 回答 0