个人中心
gpt4 book ai didi

CSS 菜单在 IE8 中不起作用

转载 作者：行者123 更新时间：2023-11-28 10:19:25 26 4
gpt4 key购买 nike

请有人帮忙。我检查了所有主题，但看不出我的代码有什么问题:

这是下面的菜单，所有的 CSS。

我还更改了标题以反射(reflect)我发现的之前未修复的帖子。 

/* =Menu
-------------------------------------------------------------- */

#access {
background: #240E04; /* Show a solid color for older browsers */
background: -moz-linear-gradient(#471B07, #0C0401);
background: -o-linear-gradient(#471B07, #0C0401);
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#471B07), to(#0C0401));  /* older webkit syntax */
background: -webkit-linear-gradient(#471B07, #0C0401);
font-family: TradeGothicCondensedNo18;
clear: both;
display: block;
float: left;
margin-left: 10px;
width:97.5%;
}
#access ul {
font-size: 18px;
text-transform: uppercase;
list-style: none;
margin: 0 0 0 0em;
padding-left: 0px;
padding-top: -50px;
}
#access li {
float: left;
position: relative;
}
#access a {
color: #eee;
display: block;
line-height: 2em;
padding: 0 0.8em;
text-decoration: none;
}
#access ul ul {
-moz-box-shadow: 0 3px 3px rgba(0,0,0,0.2);
-webkit-box-shadow: 0 3px 3px rgba(0,0,0,0.2);
box-shadow: 0 3px 3px rgba(0,0,0,0.2);
display: none;
float: left;
margin: 0;
position: absolute;
top: 2em;
left: 0;
width: 220px;
z-index: 99999;
}
#access ul ul ul {
left: 100%;
top: 0;
}
#access ul ul a {
background: #170802;
border-bottom: 1px dotted #ddd;
color: #fff;
font-size: 18px;
font-weight: normal;
height: auto;
line-height: 1.4em;
padding: 5px 5px;
width: 350px;
border: solid;
border-width: thin;
border-color: #170802;
 }
#access li:hover > a,
#access ul ul :hover > a,
#access a:focus {
background: #7A330E;
}
#access li:hover > a,
#access a:focus {
background: #f9f9f9; /* Show a solid color for older browsers */
background: -moz-linear-gradient(#7A330E, #170802);
background: -o-linear-gradient(#7A330E, #170802);
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#7A330E), to(#170802)); /* Older webkit syntax */
background: -webkit-linear-gradient(#7A330E, #170802);
color: #ffffff;
 }
#access ul li:hover > ul {
display: block;
}
#access .current-menu-item > a,
#access .current-menu-ancestor > a,
#access .current_page_item > a,
#access .current_page_ancestor > a {
font-weight: bold;
}

#footer {
background-color: #000000;
width: 97.5%;
height: 20px;
float: left;
clear: both;
margin-left: 10px;
margin-top: -0px;
font-family: 'Arial';
line-height: normal; 
font-size: 11px;
text-align: center;
color: #ffffff;
padding-top: 0.5%;
}

最佳答案

不要更改您的 nav至 div .问题是 IE8 和更早版本不允许您设置 HTML5 标签的样式。

使用 HTML5Shiv 使 IE<9 支持 HTML5 标签。

http://code.google.com/p/html5shiv/

并包含这个标签:

<!--[if lt IE 9]>
<script src="dist/html5shiv.js"></script>
<![endif]-->

来自维基百科:

HTML5Shiv is a JavaScript workaround, discovered by Sjoerd Visscher, to enable styling of HTML5 elements in versions of Internet Explorer prior to version 9, which do not allow unknown elements to be styled without JavaScript.

编辑:此外，由于您使用的是 HTML5 标记，因此应将 DOCTYPE 更改为:

<!DOCTYPE html>

关于CSS 菜单在 IE8 中不起作用，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/13191674/

26 4 0
文章推荐： css - Chrome + Lucida Grande + 自动换行
文章推荐： jquery - 当元素使用 jQuery 离开屏幕时激活滚动条？
文章推荐： html - 具有 Nav 和 Content 的两列格式在 Content 中显示 PDF 而无需额外的滚动条
文章推荐： css - 使用 CSS 在导航栏上滑动(动画)bg 图像位置