CSS 悬停背景更改在 Safari 上不起作用

发布于 2024-11-29 06:03:51 字数 2065 浏览 0 评论 0原文

我已经设置了这段代码 - 它在 Firefox 和 IE 上运行良好 - 但它在 Safari 中根本不起作用 - 有谁知道为什么这不起作用?

CSS

#list-menu { width: 235px; font-size: 1.3em; font-weight:bold; }
#list-menu ul { margin: 0; padding: 0; list-style-type: none; } 
#list-menu li { margin: 2px 0 0; } 
#list-menu a { display: block; width:235px; padding: 2px 2px 2px 10px; border: 1px solid #000000; background: #868686; text-decoration: none; } 
#list-menu a:link, #list-menu a:active, #list-menu a:visited { color: #ffffff; }
#list-menu a:hover { border: 1px solid #000000; background: #474747; color: #ffffff; } 

HTML

<div id="list-menu">
    <ul>
        <li><a href="#">Alexandra Burke</a></li>
        <li><a href="#">Avenge Sevenfold</a></li>
        <li><a href="#">Bullet For My Valentine</a></li>
        <li><a href="#">Chase & Status</a></li>
        <li><a href="#">Cliff Richard</a></li>
        <li><a href="#">Deconstruction</a></li>
        <li><a href="#">Jedward</a></li>
        <li><a href="#">JLS</a></li>
        <li><a href="#">Justin Bieber</a></li>
        <li><a href="#">Kasabian</a></li>
        <li><a href="#">Lady Gaga</a></li>
        <li><a href="#">Motorhead</a></li>
        <li><a href="#">N-Dubz</a></li>
        <li><a href="#">Olly Murs</a></li>
        <li><a href="#">Pixie Lott</a></li>
        <li><a href="#">Queen</a></li>
        <li><a href="#">The Fuel Girls</a></li>
        <li><a href="#">The Saturdays</a></li>
        <li><a href="#">The Wanted</a></li>
    </ul> 
    </div> 

I have set up this code - and it's working fine on Firefox and IE - but it's not working at all in Safari - does anyone have any ideas why this isn't working?

CSS

#list-menu { width: 235px; font-size: 1.3em; font-weight:bold; }
#list-menu ul { margin: 0; padding: 0; list-style-type: none; } 
#list-menu li { margin: 2px 0 0; } 
#list-menu a { display: block; width:235px; padding: 2px 2px 2px 10px; border: 1px solid #000000; background: #868686; text-decoration: none; } 
#list-menu a:link, #list-menu a:active, #list-menu a:visited { color: #ffffff; }
#list-menu a:hover { border: 1px solid #000000; background: #474747; color: #ffffff; } 

HTML

<div id="list-menu">
    <ul>
        <li><a href="#">Alexandra Burke</a></li>
        <li><a href="#">Avenge Sevenfold</a></li>
        <li><a href="#">Bullet For My Valentine</a></li>
        <li><a href="#">Chase & Status</a></li>
        <li><a href="#">Cliff Richard</a></li>
        <li><a href="#">Deconstruction</a></li>
        <li><a href="#">Jedward</a></li>
        <li><a href="#">JLS</a></li>
        <li><a href="#">Justin Bieber</a></li>
        <li><a href="#">Kasabian</a></li>
        <li><a href="#">Lady Gaga</a></li>
        <li><a href="#">Motorhead</a></li>
        <li><a href="#">N-Dubz</a></li>
        <li><a href="#">Olly Murs</a></li>
        <li><a href="#">Pixie Lott</a></li>
        <li><a href="#">Queen</a></li>
        <li><a href="#">The Fuel Girls</a></li>
        <li><a href="#">The Saturdays</a></li>
        <li><a href="#">The Wanted</a></li>
    </ul> 
    </div> 

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

茶底世界 2024-12-06 06:03:51

不确定也没有测试过(因为我没有 Safari),但也许 Safari 因规则声明而窒息?

尝试列出所有元素,例如

#list-menu ul li a:hover

Not sure and not tested (as I don't have Safari), but perhaps Safari is choking on the rule declaration?

Try listing all the elements, something like

#list-menu ul li a:hover
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文