在IE8中的CSS不工作

这是我的头，请有人可以帮忙吗？我做了一个网站，工作在IE9 + 10和所有其他浏览器，但在IE8的动画菜单不工作，并有使用，以查看该网站的人..在IE8中的CSS不工作

这里是CSS：

.menu, .menu ul, .menu li, .menu a { 
    margin: 0; 
    padding: 0; 
    border: none; 
    outline: none; 
} 

.menu { 
    height: 40px; 
    width: 800px; 
    background: #f7d000; 
    background: -webkit-linear-gradient(top, #f7d000 0%,#f7d000 100%); 
    background: -moz-linear-gradient(top, #f7d000 0%,#f7d000100%); 
    background: -o-linear-gradient(top, #f7d000 0%,#f7d000 100%); 
    background: -ms-linear-gradient(top, #f7d000 0%,#f7d000 100%); 
    background: linear-gradient(top, #f7d000 0%,#f7d000 100%); 
    -webkit-border-radius: 0px; 
    -moz-border-radius: 0px; 
    border-radius: 0px; 
} 

.menu li { 
    position: relative; 
    list-style: none; 
    float: left; 
    display: block; 
    height: 50px; 
} 

.menu li a { 
    display: block; 
    padding: 0 14px; 
    margin: 5px 0; 
    line-height: 28px; 
    text-decoration: none; 
    font-family: 'Titillium Web', sans-serif; 
    font-weight: bold; 
    font-size: 15px; 
    color: #000000; 
    -webkit-transition: color .2s ease-in-out; 
    -moz-transition: color .2s ease-in-out; 
    -o-transition: color .2s ease-in-out; 
    -ms-transition: color .2s ease-in-out; 
    transition: color .2s ease-in-out; 
} 

.menu li:first-child a { 
    border-left: none; 
} 

.menu li:last-child a { 
    border-right: none; 
} 

.menu li:hover > a { 
    color: #ffffff; 
} 

.menu ul { 
    position: absolute; 
    top: 40px; 
    left: 0; 
    z-index: 999; 
    opacity: 0; 
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; 
    background: #f7d000; 
    -webkit-border-radius: 0 0 5px 5px; 
    -moz-border-radius: 0 0 5px 5px; 
    border-radius: 0 0 5px 5px; 
    -webkit-transition: opacity .25s ease .1s; 
    -moz-transition: opacity .25s ease .1s; 
    -o-transition: opacity .25s ease .1s; 
    -ms-transition: opacity .25s ease .1s; 
    transition: opacity .25s ease .1s; 
} 

.menu li:hover > ul { 
    opacity: 1; 
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; 
} 

.menu ul li { 
    height: 0; 
    overflow: visible; 
    padding: 0; 
    -webkit-transition: height .25s ease .1s; 
    -moz-transition: height .25s ease .1s; 
    -o-transition: height .25s ease .1s; 
    -ms-transition: height .25s ease .1s; 
    transition: height .25s ease .1s; 
} 

.menu li:hover > ul li { 
    height: 36px; 
    overflow: visible; 
    padding: 0; 
} 

.menu ul li a { 
    width: 180px; 
    padding: 8px 10px; 
    margin: 0; 
    border: none; 
    border-bottom: 1px solid #f7d000; 
} 

.menu ul li:last-child a { 
    border: none; 
}

该网站是：www.softwaretestingawards.com任何帮助将不胜感激！

来源

2013-05-02 avamonroe

说实话，如果在网站功能IE8，没有花哨的动画，这应该是足够的。如果浏览器不自然地支持某些东西，我们不应该强迫它这样做，只是因为有些用户懒得使用他们浏览器的最佳版本。 – Kyle 2013-05-02 08:52:35

我为你清理了你的代码，我想你实际上没有在你的css文件中有'
'。 – Blowsie 2013-05-02 08:56:05

你可以把这个哦jsfiddle.net？ – gaynorvader 2013-05-02 08:56:14

IE8不支持CSS3动画。

看到这个参考： http://caniuse.com/#search=css%20tran

你很多要考虑使用JavaScript动画，像jQuery.animate

来源

2013-05-02 08:57:54 Blowsie

是啊
s只是在这里显示 – avamonroe 2013-05-02 10:41:50

@avamonroe不需要它们，SO很好地处理新行。 – Blowsie 2013-05-02 11:06:09

hehe我知道张贴在这里。编辑的CSS没有工作：/ – avamonroe 2013-05-02 12:49:42

它不会在Internet Explorer中工作的原因8是因为它不支持CSS3动画。我建议您制作一个脚本来检测Internet Explorer 8是否正在使用，如果是，则动态更改网站，以免它出现花哨的CSS3动画。

来源

2013-09-29 06:50:29 Domecraft

，使工作在IE8中的CSS，你可以尝试使用PIE.htc，如果你想http://css3pie.com/demos/参考，本网站解决方案和演示，实际上它为我工作:)

来源

2014-07-16 10:24:02 Sarav

在IE8中的CSS不工作

回答

相关问题