2012-04-03 106 views
-1

这个菜单效果很好,除了我的背景在Opera和Internet Explorer中消失,再加上关于更好的Explorer兼容性的任何提示都非常棒。在Internet Explorer和Opera中没有显示背景颜色

它也使用基础框架中的foundation.css,如果你熟悉那个。

如果你想看到它在行动:http://www.pink-realty.com

.elephant-menu { 
     width: 100% !important; 
     height: 40px; 
     z-index: 50 !important; 
     opacity: 1; 
     background: url(../images/misc/button-gloss.png) repeat-x 0 -34px, -moz-linear- gradient(top, rgba(255,255,255,.4) 0%, transparent 100%) #e51d9b; 
     -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.52), inset 0 1px 0 rgba(255,255,255,.5); 
     -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.52), inset 0 1px 0 rgba(255,255,255,.5); 
     box-shadow: 0 1px 2px rgba(0, 0, 0, 0.52), inset 0 1px 0 rgba(255,255,255,.5); 
     text-shadow: 0 -1px 1px rgba(0,0,0,0.28); 
     background: url(../images/misc/button-gloss.png) repeat-x 0 -34px, -webkit- gradient(linear, left top, left bottom, from(rgba(255,255,255,.4)), to(transparent)) #e51d9b; 
     border: 1px solid rgba(229, 33, 155, 1); 
     -webkit-transition: background-color .15s ease-in-out; 
     -moz-transition: background-color .15s ease-in-out; 
     -o-transition: background-color .15s ease-in-out; 
     text-transform: capitalize; 
     font: 16px "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif; 
     margin-left: 0; 
     margin-right: 0; 
     } 

    .elephant-menu li { 
    list-style-type: none !important; 
    text-transform: capitalize !important; 
    font-weight: bold; 
    color: white !important; 
    text-decoration: none !important; 
    float: left !important; 
    position: relative !important; 
    font-size: 16px; 
    padding: 11px 5px 10px; 
    display: block; 
    } 

    .elephant-menu li:hover { 
    color: white; 
    background-color: #9c126f; 
    -moz-box-shadow: inset 0 2px 5px black; 
    -webkit-box-shadow: inset 0 2px 5px black; 
    box-shadow: inset 0 2px 5px black; 
    -webkit-transition: all 0.3s ease-in-out; 
    -moz-transition: all 0.3s ease-in-out; 
    -o-transition: all 0.3s ease-in-out; 
    -ms-transition: all 0.3s ease-in-out; 
    transition: all 0.3s ease-in-out; 
    } 

    .elephant-menu a { 
    color: white; 
    text-decoration: none; 
    } 
+0

具体来说,你在说什么“背景”?您的网站似乎只有一个白色背景。请在您的问题中发布所有相关代码。链接只应用于演示问题,而不是消除发布代码的必要性。 – Sparky 2012-04-03 17:02:32

+0

菜单的背景。 – 2012-04-03 17:12:06

+0

再次,请在您的问题中发布相关的HTML代码。否则,当你的链接失效或被修复时,这个问题对于未来的读者将是无用的。 – Sparky 2012-04-03 17:16:31

回答

1

尝试增加一些这样的..修改您的颜色和透明度。

.elephant-menu { 
background-image: -o-linear-gradient(top, #FFFFFF 0px, #E5219B 70%); 
}