5

@mediaクエリを使用して、Chromeブラウザのみで「.l-triangle」を特定の位置に配置しています。だから私は次の方法を使用しています

@media screen and (-webkit-min-device-pixel-ratio:0) { 
/* Fix for Chrome / Safari Users ONLY */

.l-triangle {
   background: transparent url('../images/menu_bg_left.gif') no-repeat;
   position: absolute;
   float: left;
   width: 55px;
   height:75px;
   display: block;
   left: 0px;
   top:0px;
   z-index: 0;
    -webkit-box-shadow: 0 8px 6px -6px rgba(0,0,0,0.7);
       -moz-box-shadow: 0 8px 6px -6px rgba(0,0,0,0.7);
            box-shadow: 0 8px 6px -6px rgba(0,0,0,0.7);
}

画面サイズが968pxより大きいが、968pxより小さいChromeブラウザでは問題なく動作します。

私の質問は、2つの異なる画面サイズのみのChromeブラウザに2つの異なるcss値を渡すにはどうすればよいですか？

4

2 に答える 2

0

ここでも同じ問題があると思います。

このコードは Chrome でのみ機能します。

.chrome #thingie {
   do: this;
}

それがあなたを助けることを願っています。

于 2013-03-06T08:58:49.800 に答える
0

メディア クエリでは、「and」や「not」などの演算子を使用できます。

@media screen and (-webkit-min-device-pixel-ratio:0) and (min-width: 968px) {
...code here...
}
于 2014-12-09T09:25:16.557 に答える