Safari 不是运行 css display:none 属性

Question

我有以下 html:

<div id="loadinganimationsearch">
    <div style="color: #28ABE3;font-size: 14px;float: left;">Fetching Textbooks</div>   
    <div id="block_1" class="barlittle"></div>
    <div id="block_2" class="barlittle"></div>
    <div id="block_3" class="barlittle"></div>
    <div id="block_4" class="barlittle"></div>
    <div id="block_5" class="barlittle"></div>
    <br>
</div>

这是 HTML 产生的结果：

现在我有以下 CSS，作为浏览器运行s loadinganimationsearch 在 chrome 和 firefox 中没有显示。

 #loadinganimationsearch {
     display: none;
}

但是现在当我在 Safari 5.1.7 中运行它时，由于某种原因它似乎几乎忽略了 CSS。为什么会发生这种情况，我该如何解决？

Answer 1

经过四处寻找，我找到了罪魁祸首：

@-moz-keyframes move {
    0% {
        -moz-transform: scale(1.2);
        opacity: 1;
    }

    100% {
        -moz-transform: scale(0.7);
        opacity: 0.1;
    }; /* This semicolon shouldn't be here */
}

@-webkit-keyframes move {
    0% {
        -webkit-transform: scale(1.2);
        opacity: 1;
    }

    100% {
        -webkit-transform: scale(0.7);
        opacity: 0.1;
    }; /* This semicolon shouldn't be here */
}

动画关键帧百分比后不应有分号。应该是：

@-moz-keyframes move {
    0% {
        -moz-transform: scale(1.2);
        opacity: 1;
    }

    100% {
        -moz-transform: scale(0.7);
        opacity: 0.1;
    }
}

@-webkit-keyframes move {
    0% {
        -webkit-transform: scale(1.2);
        opacity: 1;
    }

    100% {
        -webkit-transform: scale(0.7);
        opacity: 0.1;
    }
}

我推测Safari解析分号后，下面CSS的none生效

Safari 不是运行 css display:none 属性

Safari not running css display:none property

html

css

safari

Safari 不是 运行 css display:none 属性

Safari not running css display:none property

html

css

safari

Safari 不是运行 css display:none 属性