CSS属性A:焦点不起作用 [英] Css property a:focus not working

问题描述

你好，

我正在使用Css a:focus，它不起作用.这是代码:

CSS:

Hello,

I''m using Css a:focus and it does not work. This is the code :

Css:

 #nav {
    
font-family:  "Lucida Grande","Lucida Sans Unicode",Arial,Verdana,sans-serif;
float:left;
position:absolute;
left:0px;
top:140px;
width:100%;
margin:5px;
padding:5px;
background-color:#DDDDDD;
}

#nav li {
display:inline;
padding:0;
margin:0;
}

#nav a:link,
#nav a:visited {
color:#555454;
width: 75px;
height: 22px;
float:left;
background:url('12.png') no-repeat;
padding:5px 0px 0px 30px;
}

#nav a:hover{
background:url('11.png') no-repeat;
border:2px solid red;
}

#nav a:active {color: orange;}​

#nav a:focus {color: red;}​

<ul id="nav">
<li><a href="/" tabindex="1">home</a></li>
<li><a href="http://google.com">explore</a></li>
</ul>

问题在于a:focus根本不起作用.当我进入首页时，第一个链接没有在CSS中指定焦点属性.

有任何想法吗?

The problem is that a:focus is not working at all. When I''m on the homepage, the first link has no focus properties specified in CSS.

Any ideas?

推荐答案

http://jsfiddle.net/uuyNH/1 / [ ^ ]
我已经测试了您的标记，并对样式进行了一些更改.

http://jsfiddle.net/uuyNH/1/[^]
I''ve tested your markup and made some changes to the style.

#nav li a:active, #nav li a:focus:active { color: orange; }
#nav li a:focus{ color: red; }
​

我希望这就是您想要的.

I hope that''s what you were looking for.

这篇关于CSS属性A:焦点不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！