CSS注意事项: 针对 Safari(WebKit)

2019-04-01 12it.net 佚名 点击: 评论
Google Chrome 的发布,使我们更加的注重基于 WebKit 核心的浏览器的表现情况,但我们很多时候“不小心”就会出现问题。考虑下面极端的情况

天晟网络 小编在整理设计教程 > web设计 > 看到CSS注意事项: 针对 Safari(WebKit),下面是小编26为您找到的16097相关内容,希望26对您有帮助。

Google Chrome 的发布,使我们更加的注重基于 WebKit 核心的浏览器的表现情况,但我们很多时候“不小心”就会出现问题。考虑下面极端的情况。

以下为引用的内容:
.box {
    background: red;
    #
    background: yellow;
    background: #green;

    }经过测试发现,Exploer 系列浏览器会显示黄色(yellow),Firefox 与 Opera 则会显示红色(red),而 Safari 以及 Chrome 则会显示绿色(green)。

按照本人的理解,这是各浏览器 CSS 解释上的差异造成的。首先,Safari 会对于 #red 这样的“常量颜色值”会尝试解析,而其他浏览器则取“#”后面的 16 进制色值。

然后对于

以下为引用的内容:

.box {
    #
    background: yellow;
}的理解,Exploer 系列会直接解析成 background: yellow; 而其他浏览器则等待“;”然后连接起来,所以不起作用。类似的可以使用

.box {
    .
    background: yellow;
}测试下。但如果语句后面加上分号“;”

.box {
    #; /* 或者 .; */
    background: yellow;
}则会恢复正常。可以参考这里,获得更进步的详细信息。

总结下的结论,首先,比如你想针对 Exploer 仅 Hack 一条语句,那么可以在其上行简单加个“.”或者“#”,这仅适合临时调试使用。

其次,期前如果不小心写成 #red 这样的色值,可能会无关要紧。但就目前众多的浏览器情况而言,可能就会有上述意想不到的结果,所以 CSS 方面的细节我们要更慎重的对待。

转载文章请标明来自天晟网 timsion.com > 设计教程 > web设计 >
标题:CSS注意事项: 针对 Safari(WebKit)
网址:http://www.timsion.com/webdesign/16097.html

关键词:CSS Safari(WebKit)

上一篇:web标准中浮动Float 概念详解 (1)
下一篇:大企业纷纷启用WEB2.0式Logo LG跟风

免责声明:以上内容来自互联网和用户投稿,不代表本站的观点和立场,版权归原作者所有,如有侵权,请与我们联系。