带有悬停边框的标志

您好，我有3个标志（意大利语，德语，英语），目的是为将来改变整个网站的语言。我怎样才能使一个悬停效果，可以alxo与IE浏览器工作的边界？带有悬停边框的标志

这是CCS

.miniflags { 
    float:right 
    margin : 5px 20px; 
    padding-right:10px; 
}

，这里的HTML

<div id="bandiere"> 
    <a><img src="ita.png" class="miniflags" /></a> 
    <a><img src="ger.png" class="miniflags" /></a> 
    <a><img src="eng.png" class="miniflags" /></a> 
</div>

thanx的帮助

亚历

来源

2010-05-30 Alpan67

完全无关，我下面的评论：重点和：悬停，使用语言标志是一个坏主意。奥地利和卢森堡人不是德国人，讲瑞士语的少数民族不是意大利人，显然是美国公民，澳大利亚人，......也会说英语。你最好写一个“italiano - deutsch - english”（有正确的lang和hreflang属性），并把它放在标题的某处。它不那么直观，但人们习惯于它。语言的解决方案没有这样的东西，可悲的事情，所以有很多解决方案，但标志远不是最好的解决方案。 – FelipeAls 2010-05-30 17:29:15

添加

.miniflags img:hover { 
    border: 1px solid #000; 
}

或

.miniflags a:hover { 
    border: 1px solid #000; 
}

到你的CSS

我相信第二届会更好地工作（：悬停）

来源

2010-05-30 14:20:56 Meta

~~如果应用miniflags类的<a>相反， :hover假选择器将工作。~~

miniflags这个类几乎没有必要。请记住，:hover仅适用于较旧版本IE的链接，因此您需要将其应用于<a>标签，而不是<img>。

<div id="bandiere"> 
    <a><img src="ita.png" /></a> 
    <a><img src="ger.png" /></a> 
    <a><img src="eng.png" /></a> 
</div> 

<style type="text/css"> 
    #bandiere img { 
     float:right 
     margin : 5px 20px; 
     padding-right:10px; 
    } 

    #bandiere a:hover, #bandiere a:focus { 
     border: 1px solid red; 
    } 
</style>

来源

2010-05-30 14:18:08 Matchu

Thanx非常有帮助和容易！ – Alpan67 2010-05-30 14:29:59

第一个版本适用于.miniflags类;没有类的最后一个版本移动所有的DIV id = bandiere – Alpan67 2010-05-30 14:36:24

啊。如果'.miniflags'出现在其他位置，那么您需要重新应用它。但'#bandiere a：hover'规则应该仍然存在，除非你需要将它应用到这个特殊div之外的* links *中。 – Matchu 2010-05-30 14:46:53

IE（直到6 IIRC）只允许悬停链接。因此，您必须将:hover添加到a而不是图片。当然，<a>必须具有href属性。

来源

2010-05-30 14:19:37 Marian

带有悬停边框的标志

回答

相关问题