CSS中如何区分谷歌浏览器的兼容

/ 0评 / 0

现在谷歌浏览器已经被很多用户认可,不仅仅是它的外观简洁,而且功能也很强大,对于我们常常写CSS的站长来说不仅要照顾谷歌浏览器,还要照顾各个主流的浏览器,有时候在按照常理写CSS的时候其他浏览都兼容某段CSS但是谷歌死活不兼容我们要怎么来做呢?

我们知道各种浏览器都有他特殊区分的hack,比如我们要区分IE6我们可以用“—”等。详细大家可以看本站的:IE6、IE7、IE8、Firefox、Opera、谷歌浏览器、Safari CSS hack区分,浏览器,其实在这篇文章里面就有介绍如何区分谷歌浏览器,由于谷歌的比较特殊好多朋友都不会,所以这篇文章详细的说以下这个如何来实现。

先来给出一个DIV

<div id="home">

这里是DIV的内容

</div>

一般我的写CSS应该是这样:

#home{width:200px;height:200px;}

但是如果要区分谷歌浏览器是这样的:

@media screen and (-webkit-min-device-pixel-ratio:0) { #home{width:300px;height:300px;} }

也就是在#home的CSS属性外面加上了@media screen and (-webkit-min-device-pixel-ratio:0) {}