-4

以下 CSS 与 ie8 完全兼容，但是当我将模式切换到 ie7 时，css 无法正常工作。在 ie7 中，div 的高度变大，并且 div 中的列表未正确显示...请帮助我.. .....这是小提琴http://jsfiddle.net/xAE9n/ 

.wrap {
    margin-left: 0px;
    margin-top: 0px;
    width: 100px;
}

.accordion1 {
    width: 178px;
    margin: 0px;
    padding: 0px;
    list-style: none;
    border: 1px solid #ddd;
}

    .accordion1 h2 {
        font-size: 12px;
        font-weight: bold;
        font-family: Arial, Helvetica, sans-serif;
        margin: 0px;
        text-decoration: none;
        padding: .25em .25em .25em 2em;
        color: #333;

        background: url("./compo_images/arrow_exp_s.gif") 1em .75em no-repeat;
        border-bottom: 1px solid #ddd;
        cursor: pointer;
    }

    .accordion1 li h2 a {
        color: black;
        text-decoration: none;
    }

a.active {
    color: white;
}

.accordion1 h2:hover {
    background:orange;
    color: white;
}

.accordion1 li div.content {
    padding: 3px;
    background: #fcfbfb;
    border-bottom: 1px solid #ddd;
    /*border: 1px solid #ddd;*/
}

.accordion1 li:hover h2 {
    color: white !important;
    background-image: url("./compo_images/arrow_exp_n.gif");
    background:orange
}

    .accordion1 li:hover h2 a {
        color: white !important;
    }

.accord > li {
    padding: 0;
    list-style-type: none;
}

    .accord > li > a {
        text-decoration: none;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12px;
        padding-left: 12px;
        color: #5f5c5c;
        background: url("./compo_images/arrow_pointer_se.gif") 0.002em no-repeat;
    }

    .accord > li > ul > li > a {
        text-decoration: none;
        color: #5f5c5c;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 11px;
        background: url("./compo_images/arrow_dirmini_orange_e.gif") 0.35em no-repeat;
        padding-left: 17px;
    }

    .accord > li > ul {
        list-style-type: none;
        text-align: left;
        margin: 0;
        padding: 1px;
    }

.accord {
    text-decoration: none;
    padding-left: 5px;
}

    .accord > li > a:hover {
        color: #f8b106;
    }

    .accord > li > ul > li > a:hover {
        color: #f8b106;
    }

.accordion1 > li > h2.active {
    color: white;
    background: url('compo_images/gradient_v_orange.gif') repeat-x;
}

    .accordion1 > li > h2.active a {
        color: white;
    }
4

2 回答 2

1

www.browserhacks.com

您可以使用仅在 IE7 中可见的 .selector\ {}（注意反斜杠）。

例子：

.className\ { color: #000; }
hr\ { color: #fff }

或者，您可能想要制作一个特定于 IE7 的样式表。将其粘贴到您网站的 head 部分将实现此目的。

<!--[if IE 7]>
<link rel="stylesheet" type="text/css" href="ie7.css">
<![endif]-->
于 2013-10-15T08:52:37.617 回答
0

您可以执行一些步骤来解决您的 IE7 问题：

  1. 仔细比较 IE7 和 IE8 中的结果。
  2. 逐一识别您遇到的所有问题
  3. 在 google 中搜索您尝试修复的具体问题（只是一个示例：“IE7 height更大的 css”）。
  4. 尝试修复它
  5. 如果没有任何效果，请在此处询问有关该特定问题的问题，并提供示例（如果可以）以及您为解决该问题所做的努力。
于 2013-10-15T09:03:36.120 回答